uid: SamsungTheFrameRemote_0.1
tags: []
props:
  parameters:
    - context: item
      description: The item to send the command to
      label: Item
      name: item
      required: false
      type: TEXT
      groupName: items
    - context: item
      description: Power Item
      label: Item
      name: itemPower
      required: true
      type: TEXT
      groupName: items
    - context: item
      description: App Item
      label: Item
      name: itemApp
      required: true
      type: TEXT
      groupName: items
    - context: item
      description: Cahnnel Item
      label: Item
      name: itemChannel
      required: true
      type: TEXT
      groupName: items
    - description: Type label to display on top of the remote (TV, Sat, Amp etc.)
      label: Device Type
      name: devicetype
      required: false
      type: TEXT
      groupName: labels
    - description: Command to power on/off
      label: Power
      name: power
      required: false
      type: TEXT
      groupName: commands
    - description: Command to increase volume
      label: Volume Up
      name: volumeup
      required: false
      type: TEXT
      groupName: commands
    - description: Command to decrease volume
      label: Volume Down
      name: volumedown
      required: false
      type: TEXT
      groupName: commands
    - description: Command to mute volume
      label: Volume Mute
      name: volumemute
      required: false
      type: TEXT
      groupName: commands
    - description: Command to switch one channel up
      label: Channel Up
      name: channelup
      required: false
      type: TEXT
      groupName: commands
    - description: Command to switch one channel down
      label: Channel Down
      name: channeldown
      required: false
      type: TEXT
      groupName: commands
    - description: Command to start Netflix
      label: Netflix
      name: netflix
      required: false
      type: TEXT
      groupName: commands
    - description: Command to start Prime Video
      label: Prime
      name: prime
      required: false
      type: TEXT
      groupName: commands
    - description: Command to start Samsung TV
      label: Samsung TV
      name: samsung
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 01
      label: Channel 01
      name: channel01
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 02
      label: Channel 02
      name: channel02
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 03
      label: Channel 03
      name: channel03
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 04
      label: Channel 04
      name: channel04
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 05
      label: Channel 05
      name: channel05
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 06
      label: Channel 06
      name: channel06
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 07
      label: Channel 07
      name: channel07
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 08
      label: Channel 08
      name: channel08
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 09
      label: Channel 09
      name: channel09
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 10
      label: Channel 10
      name: channel10
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 11
      label: Channel 11
      name: channel11
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 12
      label: Channel 12
      name: channel12
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 13
      label: Channel 13
      name: channel13
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 14
      label: Channel 14
      name: channel14
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 15
      label: Channel 15
      name: channel15
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 16
      label: Channel 16
      name: channel16
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 17
      label: Channel 17
      name: channel17
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 18
      label: Channel 18
      name: channel18
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 19
      label: Channel 19
      name: channel19
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 20
      label: Channel 20
      name: channel20
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 21
      label: Channel 21
      name: channel21
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 22
      label: Channel 22
      name: channel22
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 23
      label: Channel 23
      name: channel23
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 24
      label: Channel 24
      name: channel24
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 25
      label: Channel 25
      name: channel25
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 26
      label: Channel 26
      name: channel26
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 27
      label: Channel 27
      name: channel27
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 28
      label: Channel 28
      name: channel28
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 29
      label: Channel 29
      name: channel29
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 30
      label: Channel 30
      name: channel30
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 31
      label: Channel 31
      name: channel31
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 32
      label: Channel 32
      name: channel32
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 33
      label: Channel 33
      name: channel33
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 34
      label: Channel 34
      name: channel34
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 35
      label: Channel 35
      name: channel35
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 36
      label: Channel 36
      name: channel36
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 37
      label: Channel 37
      name: channel37
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 38
      label: Channel 38
      name: channel38
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 39
      label: Channel 39
      name: channel39
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 40
      label: Channel 40
      name: channel40
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 41
      label: Channel 41
      name: channel41
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 42
      label: Channel 42
      name: channel42
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 43
      label: Channel 43
      name: channel43
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 44
      label: Channel 44
      name: channel44
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 45
      label: Channel 45
      name: channel45
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 46
      label: Channel 46
      name: channel46
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 47
      label: Channel 47
      name: channel47
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 48
      label: Channel 48
      name: channel48
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 49
      label: Channel 49
      name: channel49
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 50
      label: Channel 50
      name: channel50
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 51
      label: Channel 51
      name: channel51
      required: false
      type: TEXT
      groupName: commands
    - description: Command for channel 52
      label: Channel 52
      name: channel52
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 1
      label: "1"
      name: one
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 2
      label: "2"
      name: two
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 3
      label: "3"
      name: three
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 4
      label: "4"
      name: four
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 5
      label: "5"
      name: five
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 6
      label: "6"
      name: six
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 7
      label: "7"
      name: seven
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 8
      label: "8"
      name: eight
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 9
      label: "9"
      name: nine
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send 0
      label: "0"
      name: zero
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Return
      label: Return
      name: return
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Exit
      label: Exit
      name: exit
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send GUIDE
      label: Guide
      name: guide
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Home/Menu
      label: Home/Menu
      name: home
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send OK/Enter
      label: OK/Enter
      name: ok
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Up
      label: Arrow Up
      name: up
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Left
      label: Arrow Left
      name: left
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Right
      label: Arrow Right
      name: right
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Down
      label: Arrow Down
      name: down
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Red
      label: Red
      name: red
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Green
      label: Green
      name: green
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Yellow
      label: Yellow
      name: yellow
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Blue
      label: Blue
      name: blue
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Rewind
      label: Rewind
      name: rewind
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Play
      label: Play
      name: play
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Pause
      label: Pause
      name: pause
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Forward
      label: Forward
      name: forward
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Previous
      label: Previous
      name: previous
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Stop
      label: Stop
      name: stop
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Record
      label: Record
      name: record
      required: false
      type: TEXT
      groupName: commands
    - description: Command to send Next
      label: Next
      name: next
      required: false
      type: TEXT
      groupName: commands
  parameterGroups:
    - name: items
      label: Items to use
    - name: labels
      label: Labels to set
    - name: commands
      label: Commands to send
timestamp: Aug 21, 2022, 7:02:33 PM
component: f7-card
config:
  style:
    --f7-card-margin-horizontal: 0px
    background-color: rgb(175, 175, 175)
    border-radius: 30px
    box-shadow: 2px 3px rgb(150,150,150)
    height: 50rem
    width: 36rem
slots:
  default:
    - component: oh-button
      config:
        action: command
        actionCommand: '=(items[props.itemPower].state !== "ON") ? "ON" : "OFF"'
        actionItem: =props.itemPower
        bgColor: black
        iconF7: power
        iconSize: 25
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 20px
          width: 60px
    - component: oh-link
      config:
        color: black
        style:
          display: flex
          font-size: 25px
          height: 40px
          left: 90px
          position: absolute
          top: 20px
          width: 60px
        text: '=(props.devicetype) ? props.devicetype : "TV"'
    - component: oh-button
      config:
        action: command
        actionCommand: =props.volumemute
        actionItem: =props.item
        bgColor: black
        iconF7: speaker_slash
        iconSize: 25
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 20px
          width: 60px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.one
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 80px
          width: 60px
        text: 1
    - component: oh-button
      config:
        action: command
        actionCommand: =props.two
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 90px
          position: absolute
          top: 80px
          width: 60px
        text: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.three
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 80px
          width: 60px
        text: 3
    - component: oh-button
      config:
        action: command
        actionCommand: =props.four
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 130px
          width: 60px
        text: 4
    - component: oh-button
      config:
        action: command
        actionCommand: =props.five
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 90px
          position: absolute
          top: 130px
          width: 60px
        text: 5
    - component: oh-button
      config:
        action: command
        actionCommand: =props.six
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 130px
          width: 60px
        text: 6
    - component: oh-button
      config:
        action: command
        actionCommand: =props.seven
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 180px
          width: 60px
        text: 7
    - component: oh-button
      config:
        action: command
        actionCommand: =props.eight
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 90px
          position: absolute
          top: 180px
          width: 60px
        text: 8
    - component: oh-button
      config:
        action: command
        actionCommand: =props.nine
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 180px
          width: 60px
        text: 9
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel01
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 20px
          width: 60px
        url: =('/static/TV/' + props.channel01 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel02
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 340px
          position: absolute
          top: 20px
          width: 60px
        url: =('/static/TV/' + props.channel02 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel03
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 20px
          width: 60px
        url: =('/static/TV/' + props.channel03 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel04
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 20px
          width: 60px
        url: =('/static/TV/' + props.channel04 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel05
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 260px
          position: absolute
          top: 85px
          width: 60px
        url: =('/static/TV/' + props.channel05 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel06
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 340px
          position: absolute
          top: 80px
          width: 60px
        url: =('/static/TV/' + props.channel06 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel07
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 420px
          position: absolute
          top: 80px
          width: 50px
        url: =('/static/TV/' + props.channel07 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel08
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 80px
          width: 60px
        url: =('/static/TV/' + props.channel08 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel09
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 260px
          position: absolute
          top: 150px
          width: 60px
        url: =('/static/TV/' + props.channel09 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel10
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 345px
          position: absolute
          top: 140px
          width: 50px
        url: =('/static/TV/' + props.channel10 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel11
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 140px
          width: 60px
        url: =('/static/TV/' + props.channel11 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel12
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 500px
          position: absolute
          top: 150px
          width: 60px
        url: =('/static/TV/' + props.channel12 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel13
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 260px
          position: absolute
          top: 210px
          width: 60px
        url: =('/static/TV/' + props.channel13 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel14
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 340px
          position: absolute
          top: 210px
          width: 60px
        url: =('/static/TV/' + props.channel14 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel15
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 200px
          width: 60px
        url: =('/static/TV/' + props.channel15 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel16
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 200px
          width: 60px
        url: =('/static/TV/' + props.channel16 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel17
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 260px
          width: 60px
        url: =('/static/TV/' + props.channel17 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel18
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 340px
          position: absolute
          top: 265px
          width: 60px
        url: =('/static/TV/' + props.channel18 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel19
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 420px
          position: absolute
          top: 260px
          width: 60px
        url: =('/static/TV/' + props.channel19 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel20
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 500px
          position: absolute
          top: 265px
          width: 60px
        url: =('/static/TV/' + props.channel20 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel21
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 320px
          width: 60px
        url: =('/static/TV/' + props.channel21 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel22
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 340px
          position: absolute
          top: 325px
          width: 60px
        url: =('/static/TV/' + props.channel22 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel23
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 320px
          width: 60px
        url: =('/static/TV/' + props.channel23 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel24
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 320px
          width: 60px
        url: =('/static/TV/' + props.channel24 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel25
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 380px
          width: 60px
        url: =('/static/TV/' + props.channel25 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel26
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 340px
          position: absolute
          top: 385px
          width: 60px
        url: =('/static/TV/' + props.channel26 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel27
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 380px
          width: 60px
        url: =('/static/TV/' + props.channel27 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel28
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 380px
          width: 60px
        url: =('/static/TV/' + props.channel28 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel29
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 260px
          position: absolute
          top: 450px
          width: 60px
        url: =('/static/TV/' + props.channel29 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel30
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 340px
          position: absolute
          top: 450px
          width: 60px
        url: =('/static/TV/' + props.channel30 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel31
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 420px
          position: absolute
          top: 450px
          width: 60px
        url: =('/static/TV/' + props.channel31 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel32
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 500px
          position: absolute
          top: 450px
          width: 60px
        url: =('/static/TV/' + props.channel32 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel33
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 260px
          position: absolute
          top: 510px
          width: 60px
        url: =('/static/TV/' + props.channel33 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel34
        actionItem: =props.itemChannel
        style:
          height: 20px
          left: 340px
          position: absolute
          top: 510px
          width: 60px
        url: =('/static/TV/' + props.channel34 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel35
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 420px
          position: absolute
          top: 505px
          width: 60px
        url: =('/static/TV/' + props.channel35 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel36
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 500px
          width: 60px
        url: =('/static/TV/' + props.channel36 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel37
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 260px
          position: absolute
          top: 565px
          width: 60px
        url: =('/static/TV/' + props.channel37 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel38
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 340px
          position: absolute
          top: 560px
          width: 60px
        url: =('/static/TV/' + props.channel38 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel39
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 560px
          width: 60px
        url: =('/static/TV/' + props.channel39 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel40
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 560px
          width: 60px
        url: =('/static/TV/' + props.channel40 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel41
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 620px
          width: 60px
        url: =('/static/TV/' + props.channel41 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel42
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 340px
          position: absolute
          top: 620px
          width: 60px
        url: =('/static/TV/' + props.channel42 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel43
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 420px
          position: absolute
          top: 625px
          width: 60px
        url: =('/static/TV/' + props.channel43 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel44
        actionItem: =props.itemChannel
        style:
          height: 30px
          left: 500px
          position: absolute
          top: 625px
          width: 60px
        url: =('/static/TV/' + props.channel44 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel45
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 680px
          width: 60px
        url: =('/static/TV/' + props.channel45 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel46
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 340px
          position: absolute
          top: 680px
          width: 60px
        url: =('/static/TV/' + props.channel46 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel47
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 680px
          width: 60px
        url: =('/static/TV/' + props.channel47 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel48
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 680px
          width: 60px
        url: =('/static/TV/' + props.channel48 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel49
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 260px
          position: absolute
          top: 740px
          width: 60px
        url: =('/static/TV/' + props.channel49 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel50
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 340px
          position: absolute
          top: 740px
          width: 60px
        url: =('/static/TV/' + props.channel50 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel51
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 420px
          position: absolute
          top: 740px
          width: 60px
        url: =('/static/TV/' + props.channel51 + '.svg')
    - component: oh-image
      config:
        action: command
        actionCommand: =props.channel52
        actionItem: =props.itemChannel
        style:
          height: 40px
          left: 500px
          position: absolute
          top: 740px
          width: 60px
        url: =('/static/TV/' + props.channel52 + '.svg')
    - component: oh-button
      config:
        action: command
        actionCommand: =props.home
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: house
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 230px
          width: 60px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.zero
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 90px
          position: absolute
          top: 230px
          width: 60px
        text: "0"
    - component: oh-button
      config:
        action: command
        actionCommand: =props.return
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: arrow_uturn_left
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 230px
          width: 60px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.exit
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 280px
          width: 60px
        text: EXIT
    - component: oh-button
      config:
        action: command
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 90px
          position: absolute
          top: 280px
          width: 60px
        text: ""
    - component: oh-button
      config:
        action: command
        actionCommand: =props.guide
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 280px
          width: 60px
        text: GUIDE
    - component: f7-badge
      config:
        bgColor: black
        style:
          border-radius: 30%
          height: 152px
          left: 44px
          position: absolute
          top: 344px
          transform: rotate(45deg)
          width: 152px
          z-index: 1
    - component: oh-button
      config:
        action: command
        actionCommand: =props.ok
        actionItem: =props.item
        bgColor: black
        color: white
        style:
          border: gray solid 1px
          border-radius: 50%
          display: flex
          font-size: 25px
          height: 80px
          left: 80px
          position: absolute
          top: 380px
          width: 80px
          z-index: 2
        text: OK
    - component: oh-button
      config:
        action: command
        actionCommand: =props.volumeup
        actionItem: =props.item
        bgColor: black
        color: black
        style:
          border-radius: 20%
          height: 40px
          left: 18px
          position: absolute
          top: 335px
          transform: skew(-45deg)
          width: 55px
          z-index: 1
    - component: oh-link
      config:
        action: command
        actionCommand: =props.volumeup
        actionItem: =props.item
        color: white
        iconF7: speaker_3
        iconSize: 25
        style:
          display: flex
          left: 35px
          position: absolute
          top: 340px
          z-index: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.up
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: arrowtriangle_up
        iconSize: 35
        style:
          display: flex
          height: 40px
          left: 100px
          position: absolute
          top: 335px
          width: 40px
          z-index: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.channelup
        actionItem: =props.item
        bgColor: black
        color: black
        style:
          border-radius: 20%
          height: 40px
          left: 167px
          position: absolute
          top: 335px
          transform: skew(45deg)
          width: 55px
          z-index: 1
    - component: oh-link
      config:
        action: command
        actionCommand: =props.channelup
        actionItem: =props.item
        color: white
        style:
          display: flex
          font-size: 20px
          left: 178px
          position: absolute
          top: 340px
          z-index: 2
        text: CH+
    - component: oh-button
      config:
        action: command
        actionCommand: =props.left
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: arrowtriangle_left
        iconSize: 35
        style:
          display: flex
          height: 40px
          left: 35px
          position: absolute
          top: 400px
          width: 40px
          z-index: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.right
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: arrowtriangle_right
        iconSize: 35
        style:
          display: flex
          height: 40px
          left: 165px
          position: absolute
          top: 400px
          width: 40px
          z-index: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.volumedown
        actionItem: =props.item
        bgColor: black
        color: black
        style:
          border-radius: 20%
          height: 40px
          left: 18px
          position: absolute
          top: 465px
          transform: skew(45deg)
          width: 55px
          z-index: 1
    - component: oh-link
      config:
        action: command
        actionCommand: =props.volumedown
        actionItem: =props.item
        color: white
        iconF7: speaker_1
        iconSize: 25
        style:
          display: flex
          left: 35px
          position: absolute
          top: 475px
          z-index: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.down
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: arrowtriangle_down
        iconSize: 35
        style:
          display: flex
          height: 40px
          left: 100px
          position: absolute
          top: 465px
          width: 40px
          z-index: 2
    - component: oh-button
      config:
        action: command
        actionCommand: =props.channeldown
        actionItem: =props.item
        bgColor: black
        color: black
        style:
          border-radius: 20%
          height: 40px
          left: 167px
          position: absolute
          top: 465px
          transform: skew(-45deg)
          width: 55px
          z-index: 1
    - component: oh-link
      config:
        action: command
        actionCommand: =props.channeldown
        actionItem: =props.item
        color: white
        style:
          display: flex
          font-size: 20px
          left: 178px
          position: absolute
          top: 470px
          z-index: 2
        text: CH-
    - component: oh-button
      config:
        action: command
        actionCommand: =props.netflix
        actionItem: =props.itemApp
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 20px
          position: absolute
          top: 520px
          width: 60px
        text: Netflix
    - component: oh-button
      config:
        action: command
        actionCommand: =props.prime
        actionItem: =props.itemApp
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 90px
          position: absolute
          top: 520px
          width: 60px
        text: Prime
    - component: oh-button
      config:
        action: command
        actionCommand: =props.samsung
        actionItem: =props.itemApp
        bgColor: black
        color: white
        style:
          border-radius: 12px
          display: flex
          height: 40px
          left: 160px
          position: absolute
          top: 520px
          width: 60px
        text: Samsung
    - component: oh-button
      config:
        action: command
        actionCommand: =props.red
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: circle_fill
        iconSize: 25
        style:
          border-radius: 12px
          color: red
          display: flex
          height: 40px
          left: 25px
          position: absolute
          top: 570px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.green
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: circle_fill
        iconSize: 25
        style:
          border-radius: 12px
          color: green
          display: flex
          height: 40px
          left: 75px
          position: absolute
          top: 570px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.yellow
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: circle_fill
        iconSize: 25
        style:
          border-radius: 12px
          color: yellow
          display: flex
          height: 40px
          left: 125px
          position: absolute
          top: 570px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.blue
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: circle_fill
        iconSize: 25
        style:
          border-radius: 12px
          color: blue
          display: flex
          height: 40px
          left: 175px
          position: absolute
          top: 570px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.rewind
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: backward
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 25px
          position: absolute
          top: 620px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.play
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: play_fill
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 75px
          position: absolute
          top: 620px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.pause
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: pause
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 125px
          position: absolute
          top: 620px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.forward
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: forward
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 175px
          position: absolute
          top: 620px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.previous
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: backward_end_alt
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 25px
          position: absolute
          top: 670px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.stop
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: stop_fill
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 75px
          position: absolute
          top: 670px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.record
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: circle_fill
        iconSize: 20
        style:
          border-radius: 12px
          color: red
          display: flex
          height: 40px
          left: 125px
          position: absolute
          top: 670px
          width: 40px
    - component: oh-button
      config:
        action: command
        actionCommand: =props.next
        actionItem: =props.item
        bgColor: black
        color: white
        iconF7: forward_end_alt
        iconSize: 25
        style:
          border-radius: 12px
          color: white
          display: flex
          height: 40px
          left: 175px
          position: absolute
          top: 670px
          width: 40px