.interact-control.fill-height.as-table.stf-device-control(ng-controller='DeviceControlCtrl')
  .as-cell.fill-height
    .as-table.fill-height
      .stf-vnc-navbar.as-row(ng-show='!$root.basicMode && !$root.standalone')
        .stf-vnc-right-buttons.pull-right
          .btn-group
            label.btn-sm.btn-primary-outline(type='button', ng-click='tryToRotate("portrait")',
            ng-model='currentRotation', btn-radio='"portrait"').pointer
              i.fa.fa-mobile(tooltip='{{ "Portrait" | translate }} (Current rotation: {{ device.display.rotation }}°)', tooltip-placement='bottom')
            label.btn-sm.btn-primary-outline(type='button', ng-click='tryToRotate("landscape")',
              ng-model='currentRotation', btn-radio='"landscape"').pointer
              i.fa.fa-mobile.fa-rotate-90(tooltip='{{ "Landscape" | translate }} (Current rotation: {{ device.display.rotation }}°)', tooltip-placement='bottom')
          .button-spacer
          button(type='button', ng-model='showScreen', btn-checkbox).btn.btn-sm.btn-danger
            i(ng-show='showScreen', tooltip-html-unsafe='{{"Hide Screen"|translate}}', tooltip-placement='bottom').fa.fa-eye
            i(ng-show='!showScreen', tooltip-html-unsafe='{{"Show Screen"|translate}}', tooltip-placement='bottom').fa.fa-eye-slash

        .device-name-container(dropdown)
          a.stf-vnc-device-name.pointer.unselectable(dropdown-toggle)
            p
              .device-small-image
                img(ng-src='/static/app/devices/icon/x24/{{ device.image || "E30HT.jpg" }}')
              span.device-name-text {{ device.enhancedName }}
              span.caret(ng-show='groupDevices.length > 0')

          ul.dropdown-menu(role='menu', data-toggle='dropdown', ng-show='groupDevices.length > 0').pointer.unselectable
            li(ng-repeat='groupDevice in groupDevices')
              a(ng-click='controlDevice(groupDevice); $event.stopPropagation()')
                .pull-left
                  .device-small-image
                    img(ng-src='/static/app/devices/icon/x24/{{ groupDevice.image || "E30HT.jpg" }}')
                  span(ng-class='{"current-device": groupDevice.serial === device.serial }') {{ groupDevice.enhancedName }}

                .pull-right(ng-click='kickDevice(groupDevice); $event.stopPropagation()').kick-device
                  i.fa.fa-times
                .clearfix

      .as-row.fill-height

        div(ng-controller='DeviceScreenCtrl', ng-if='device').fill-height
          div(ng-file-drop='installFile($files)', ng-file-drag-over-class='dragover').fill-height
            device-context-menu(device='device', control='control')
              device-screen(device='device', control='control')

      .stf-vnc-bottom.as-row(ng-hide='$root.standalone')
        .controls
          .btn-group.btn-group-justified
            a(device-control-key='menu', title='{{"Menu"|translate}}').btn.btn-primary.btn-lg.no-transition
              i.fa.fa-bars
            a(device-control-key='home', title='{{"Home"|translate}}').btn.btn-primary.btn-lg.no-transition
              i.fa.fa-home
            a(device-control-key='back', title='{{"Back"|translate}}').btn.btn-primary.btn-lg.no-transition
              i.fa.fa-mail-reply