div(pane='center')
  .row
    .col-md-4
      div(ng-include='"settings/local/local-settings.jade"')
    .col-md-4
      div(ng-include='"settings/language/language.jade"')
    .col-md-4
      div(ng-include='"settings/notifications/notifications.jade"')

  //.row //(ng-controller='PortForwardingCtrl')
    .col-md-12
      .widget-container.fluid-height
        .heading
          i.fa.fa-arrow-circle-o-right
          span(translate) Reverse Port Forwarding
        .widget-content.padded
          div //(ng-controller='PortForwardingCtrl')
            .xcol-md-6
              //label.checkbox
                input(type='checkbox', ng-model='autoPortForwarding', ng-disabled='true')
                span Auto-enable reverse port forwarding on connect
              table(ng-table='portsTable').table
                thead
                  tr
                    th
                      div {{"Target IP / Hostname"|translate}}
                    th
                      div {{"Target Port"|translate}}
                    th
                      div {{"Device Port"|translate}}
                tbody
                  tr(ng-repeat='result in $data')
                    td(data-title="'Target IP / Hostname'")
                      input(type='text', ng-model='result.targetHost', placeholder='{{"Target host (detect if blank)"|translate}}')
                    td(data-title="'Target Port'")
                      input(type='number', ng-model='result.targetPort', ng-change='targetPortChanged(result)', placeholder='{{"Example: 3000"|translate}}')
                    td(data-title="'Device Port'")
                      input(type='number', ng-model='result.devicePort', placeholder='{{"Example: 3000"|translate}}')
                    //td(titlew)
              button(ng-click='forwarding = !forwarding', ng-class="{active: forwarding}").btn.btn-primary
                i.fa(ng-class="{'fa-arrow-circle-right': !forwarding, 'fa-times-circle': forwarding}")
                span(ng-show='forwarding', translate) Unforward Ports
                span(ng-hide='forwarding', translate) Forward Ports
              table(ng-table='deviceStatusTable', ng-hide='!devicesStatus.length').table
                tr(ng-repeat='result in $data')
                  td(title="'Device'")
                    p {{ result.deviceId }}
                  td(title="'Reachable'")
                    i(ng-class="{'text-status-on': result.value.connectable, 'text-status-off': !result.value.connectable}").fa.fa-circle
                  td(title="'Connected'")
                    i(ng-class="{'text-status-on': result.value.connected, 'text-status-off': !result.value.connected}").fa.fa-circle