ground/gcs/src/share/qml/pfd/Panels.qml

   1 /*
   2  * Copyright (C) 2016 The LibrePilot Project
   3  * Contact: http://www.librepilot.org
   4  *
   5  * This file is part of LibrePilot GCS.
   6  *
   7  * LibrePilot GCS is free software: you can redistribute it and/or modify
   8  * it under the terms of the GNU General Public License as published by
   9  * the Free Software Foundation, either version 3 of the License, or
  10  * (at your option) any later version.
  11  *
  12  * LibrePilot GCS is distributed in the hope that it will be useful,
  13  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  14  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  15  * GNU General Public License for more details.
  16  *
  17  * You should have received a copy of the GNU General Public License
  18  * along with LibrePilot GCS.  If not, see <http://www.gnu.org/licenses/>.
  19  */
  20 import QtQuick 2.0
  21
  22 import "../js/common.js" as Utils
  23 import "../js/uav.js" as UAV
  24
  25 Item {
  26     id: panels
  27     property variant sceneSize
  28
  29     //
  30     // Panel functions
  31     //
  32
  33     property bool show_panels: false
  34     property bool display_rc: false
  35     property bool display_bat: false
  36     property bool display_oplm: false
  37     property bool display_sys: false
  38
  39     function close_panels(){
  40         if (show_panels == true)
  41             show_panels = false;
  42         else
  43             show_panels = true;
  44     }
  45
  46     function hide_display_rcinput(){
  47         show_panels = true;
  48         display_oplm = false
  49         display_bat = false
  50         rc_input_bg.z = 10
  51         battery_bg.z = -1
  52         oplm_bg.z = -1
  53         system_bg.z = -1
  54     }
  55
  56     function hide_display_battery(){
  57         show_panels = true;
  58         display_oplm = false
  59         display_bat = true
  60         rc_input_bg.z = 10
  61         battery_bg.z = 20
  62         oplm_bg.z = -1
  63         system_bg.z = -1
  64     }
  65
  66     function hide_display_oplink(){
  67         show_panels = true;
  68         display_oplm = true
  69         display_bat = false
  70         rc_input_bg.z = 10
  71         battery_bg.z = 20
  72         oplm_bg.z = 30
  73         system_bg.z = -1
  74     }
  75
  76     function hide_display_system(){
  77         show_panels = true;
  78         display_oplm = false
  79         display_bat = false
  80         rc_input_bg.z = 10
  81         battery_bg.z = 20
  82         oplm_bg.z = 30
  83         system_bg.z = 40
  84     }
  85
  86     property real smeter_angle
  87
  88     // Needed to get correctly int8 value
  89     property int oplm_rssi: telemetry_link ? UAV.oplmRSSI() : -127
  90
  91     property real telemetry_sum
  92     property real telemetry_sum_old
  93     property bool telemetry_link
  94
  95     // Hack : check if telemetry is active. Works with real link and log replay
  96
  97     function telemetry_check() {
  98        telemetry_sum = opLinkStatus.rxRate + opLinkStatus.txRate
  99
 100        if (telemetry_sum != telemetry_sum_old || UAV.isOplmConnected()) {
 101            telemetry_link = 1
 102        } else {
 103            telemetry_link = 0
 104        }
 105        telemetry_sum_old = telemetry_sum
 106     }
 107
 108     Timer {
 109          id: telemetry_activity
 110          interval: 1200; running: true; repeat: true
 111          onTriggered: telemetry_check()
 112     }
 113
 114     // Filtering for S-meter. Smeter range -127dB <--> -13dB = S9+60dB
 115
 116     Timer {
 117          id: smeter_filter
 118          interval: 100; running: true; repeat: true
 119          onTriggered: smeter_angle = (0.90 * smeter_angle) + (0.1 * (oplm_rssi + 13))
 120     }
 121
 122     // End Functions
 123     //
 124     // Start Drawing
 125
 126     //
 127     // Animation properties
 128     //
 129
 130     property double offset_value: close_bg.width * 0.85
 131
 132     property int anim_type: Easing.OutExpo
 133     property int anim_duration: 1600
 134
 135     //
 136     // Close - Open panel
 137     //
 138
 139     SvgElementImage {
 140         id: close_bg
 141         elementName: "close-bg"
 142         sceneSize: panels.sceneSize
 143         y: Math.floor(scaledBounds.y * sceneItem.height)
 144
 145
 146         states: State {
 147              name: "fading"
 148              when: show_panels == true
 149              PropertyChanges { target: close_bg; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 150         }
 151
 152         transitions: Transition {
 153             SequentialAnimation {
 154                 id: close_anim
 155                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 156             }
 157         }
 158     }
 159
 160     SvgElementImage {
 161         id: panel_open_icon
 162         elementName: "panel-open-icon"
 163         sceneSize: panels.sceneSize
 164         y: Math.floor(scaledBounds.y * sceneItem.height)
 165         z: close_bg.z + 1
 166         opacity: show_panels == true ? 0 : 1
 167
 168         states: State {
 169              name: "fading"
 170              when: show_panels == true
 171              PropertyChanges { target: panel_open_icon; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 172              PropertyChanges { target: panel_open_icon; opacity: 0; }
 173         }
 174
 175         transitions: Transition {
 176             SequentialAnimation {
 177                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 178                 PropertyAnimation { property: "opacity"; duration: 500; }
 179             }
 180         }
 181     }
 182
 183     SvgElementImage {
 184         id: close_mousearea
 185         elementName: "close-panel-mousearea"
 186         sceneSize: panels.sceneSize
 187         y: Math.floor(scaledBounds.y * sceneItem.height)
 188         z: close_bg.z + 100
 189
 190         TooltipArea {
 191             text: show_panels == true ? "Close panels" : "Open panels"
 192         }
 193
 194         MouseArea {
 195              id: hidedisp_close;
 196              anchors.fill: parent;
 197              cursorShape: Qt.PointingHandCursor
 198              onClicked: close_panels()
 199         }
 200
 201         states: State {
 202              name: "fading"
 203              when: show_panels == true
 204              PropertyChanges { target: close_mousearea; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 205         }
 206
 207         transitions: Transition {
 208             SequentialAnimation {
 209                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 210             }
 211         }
 212     }
 213
 214     //
 215     // Rc-Input panel
 216     //
 217
 218     SvgElementImage {
 219         id: rc_input_bg
 220         elementName: "rc-input-bg"
 221         sceneSize: panels.sceneSize
 222         y: Math.floor(scaledBounds.y * sceneItem.height)
 223         z: 10
 224
 225         states: State {
 226              name: "fading"
 227              when: show_panels == true
 228              PropertyChanges { target: rc_input_bg; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 229         }
 230
 231         transitions: Transition {
 232             SequentialAnimation {
 233                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 234             }
 235         }
 236     }
 237
 238     SvgElementImage {
 239         id: rc_input_labels
 240         elementName: "rc-input-labels"
 241         sceneSize: panels.sceneSize
 242         y: Math.floor(scaledBounds.y * sceneItem.height)
 243         z: rc_input_bg.z + 1
 244
 245         states: State {
 246              name: "fading"
 247              when: show_panels == true
 248              PropertyChanges { target: rc_input_labels; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 249         }
 250
 251         transitions: Transition {
 252             SequentialAnimation {
 253                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 254             }
 255         }
 256     }
 257
 258     SvgElementImage {
 259         id: rc_input_mousearea
 260         elementName: "rc-input-panel-mousearea"
 261         sceneSize: panels.sceneSize
 262         y: Math.floor(scaledBounds.y * sceneItem.height)
 263         z: rc_input_bg.z + 1
 264
 265         TooltipArea {
 266             text: "RC panel"
 267         }
 268
 269         MouseArea {
 270              id: hidedisp_rcinput;
 271              anchors.fill: parent;
 272              cursorShape: Qt.PointingHandCursor
 273              onClicked: hide_display_rcinput()
 274         }
 275
 276         states: State {
 277              name: "fading"
 278              when: show_panels == true
 279              PropertyChanges { target: rc_input_mousearea; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 280         }
 281
 282         transitions: Transition {
 283             SequentialAnimation {
 284                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 285             }
 286         }
 287     }
 288
 289     SvgElementImage {
 290         id: rc_throttle
 291         elementName: "rc-throttle"
 292         sceneSize: panels.sceneSize
 293         z: rc_input_bg.z+2
 294
 295         width: scaledBounds.width * sceneItem.width
 296         height: (scaledBounds.height * sceneItem.height) * (manualControlCommand.throttle)
 297
 298         x: scaledBounds.x * sceneItem.width
 299         y: (scaledBounds.y * sceneItem.height) - rc_throttle.height + (scaledBounds.height * sceneItem.height)
 300
 301         smooth: true
 302
 303         states: State {
 304              name: "fading"
 305              when: show_panels == true
 306              PropertyChanges { target: rc_throttle; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 307         }
 308
 309         transitions: Transition {
 310             SequentialAnimation {
 311                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 312             }
 313         }
 314     }
 315
 316     SvgElementImage {
 317         id: rc_stick
 318         elementName: "rc-stick"
 319         sceneSize: panels.sceneSize
 320         z: rc_input_bg.z+3
 321
 322         width: scaledBounds.width * sceneItem.width
 323         height: scaledBounds.height * sceneItem.height
 324
 325         y: (scaledBounds.y * sceneItem.height) + (manualControlCommand.pitch * rc_stick.width * 2.5)
 326
 327         smooth: true
 328
 329         //rotate it around his center
 330         transform: Rotation {
 331             angle: manualControlCommand.yaw * 90
 332             origin.y : rc_stick.height / 2
 333             origin.x : rc_stick.width / 2
 334         }
 335
 336         states: State {
 337              name: "fading"
 338              when: show_panels == true
 339              PropertyChanges { target: rc_stick; x: Math.floor(scaledBounds.x * sceneItem.width) + (manualControlCommand.roll * rc_stick.width * 2.5) + offset_value; }
 340         }
 341
 342         transitions: Transition {
 343             SequentialAnimation {
 344                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 345             }
 346         }
 347     }
 348
 349     //
 350     // Battery panel
 351     //
 352
 353     SvgElementImage {
 354         id: battery_bg
 355         elementName: "battery-bg"
 356         sceneSize: panels.sceneSize
 357         y: Math.floor(scaledBounds.y * sceneItem.height)
 358         z: 20
 359
 360         states: State {
 361              name: "fading"
 362              when: show_panels == true
 363              PropertyChanges { target: battery_bg; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 364         }
 365
 366         transitions: Transition {
 367             SequentialAnimation {
 368                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 369             }
 370         }
 371     }
 372
 373     SvgElementPositionItem {
 374         id: battery_volt
 375         sceneSize: panels.sceneSize
 376         elementName: "battery-volt-text"
 377         z: battery_bg.z + 1
 378
 379         width: scaledBounds.width * sceneItem.width
 380         height: scaledBounds.height * sceneItem.height
 381         y: scaledBounds.y * sceneItem.height
 382
 383         states: State {
 384              name: "fading"
 385              when: show_panels == true
 386              PropertyChanges { target: battery_volt; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 387         }
 388
 389         transitions: Transition {
 390             SequentialAnimation {
 391                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 392             }
 393         }
 394
 395         Rectangle {
 396             anchors.fill: parent
 397             color: UAV.batteryAlarmColor()
 398             border.color: "white"
 399             border.width: battery_volt.width * 0.01
 400             radius: border.width * 4
 401
 402             Text {
 403                text: UAV.batteryVoltage()
 404                anchors.centerIn: parent
 405                color: "white"
 406                font {
 407                    family: pt_bold.name
 408                    pixelSize: Math.floor(parent.height * 0.6)
 409                }
 410             }
 411         }
 412     }
 413
 414     SvgElementPositionItem {
 415         id: battery_amp
 416         sceneSize: panels.sceneSize
 417         elementName: "battery-amp-text"
 418         z: battery_bg.z+2
 419
 420         width: scaledBounds.width * sceneItem.width
 421         height: scaledBounds.height * sceneItem.height
 422         y: scaledBounds.y * sceneItem.height
 423
 424         states: State {
 425              name: "fading"
 426              when: show_panels == true
 427              PropertyChanges { target: battery_amp; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 428         }
 429
 430         transitions: Transition {
 431             SequentialAnimation {
 432                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 433             }
 434         }
 435
 436         Rectangle {
 437             anchors.fill: parent
 438             color: UAV.batteryAlarmColor()
 439             border.color: "white"
 440             border.width: battery_volt.width * 0.01
 441             radius: border.width * 4
 442
 443             Text {
 444                text: UAV.batteryCurrent()
 445                anchors.centerIn: parent
 446                color: "white"
 447                font {
 448                    family: pt_bold.name
 449                    pixelSize: Math.floor(parent.height * 0.6)
 450                }
 451             }
 452         }
 453     }
 454
 455     SvgElementPositionItem {
 456         id: battery_milliamp
 457         sceneSize: panels.sceneSize
 458         elementName: "battery-milliamp-text"
 459         z: battery_bg.z+3
 460
 461         width: scaledBounds.width * sceneItem.width
 462         height: scaledBounds.height * sceneItem.height
 463         y: scaledBounds.y * sceneItem.height
 464
 465         states: State {
 466              name: "fading"
 467              when: show_panels == true
 468              PropertyChanges { target: battery_milliamp; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 469         }
 470
 471         transitions: Transition {
 472             SequentialAnimation {
 473                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 474             }
 475         }
 476
 477         Rectangle {
 478             anchors.fill: parent
 479
 480             TooltipArea {
 481                text: "Reset consumed energy"
 482                visible: display_bat == true ? 1 : 0
 483             }
 484
 485             MouseArea {
 486                id: reset_panel_consumed_energy_mouseArea;
 487                anchors.fill: parent;
 488                cursorShape: Qt.PointingHandCursor;
 489                visible: display_bat == true ? 1 : 0
 490                onClicked: pfdContext.resetConsumedEnergy();
 491             }
 492
 493             // Alarm based on estimatedFlightTime < 120s orange, < 60s red
 494             color: UAV.estimatedTimeAlarmColor()
 495
 496             border.color: "white"
 497             border.width: battery_volt.width * 0.01
 498             radius: border.width * 4
 499
 500             Text {
 501                text: UAV.batteryConsumedEnergy()
 502                anchors.centerIn: parent
 503                color: "white"
 504                font {
 505                    family: pt_bold.name
 506                    pixelSize: Math.floor(parent.height * 0.6)
 507                }
 508             }
 509         }
 510     }
 511
 512     SvgElementPositionItem {
 513         id: battery_estimated_flight_time
 514         sceneSize: panels.sceneSize
 515         elementName: "battery-estimated-flight-time"
 516         z: battery_bg.z+4
 517
 518         width: scaledBounds.width * sceneItem.width
 519         height: scaledBounds.height * sceneItem.height
 520         y: scaledBounds.y * sceneItem.height
 521
 522         states: State {
 523              name: "fading"
 524              when: show_panels == true
 525              PropertyChanges { target: battery_estimated_flight_time; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 526         }
 527
 528         transitions: Transition {
 529             SequentialAnimation {
 530                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 531             }
 532         }
 533
 534         Rectangle {
 535             anchors.fill: parent
 536
 537             TooltipArea {
 538                text: "Reset consumed energy"
 539                visible: display_bat == true ? 1 : 0
 540             }
 541
 542             MouseArea {
 543                id: reset_panel_consumed_energy_mouseArea2;
 544                anchors.fill: parent;
 545                cursorShape: Qt.PointingHandCursor;
 546                visible: display_bat == true ? 1 : 0
 547                onClicked: pfdContext.resetConsumedEnergy();
 548             }
 549
 550             // Alarm based on estimatedFlightTime < 120s orange, < 60s red
 551             color: UAV.estimatedTimeAlarmColor()
 552
 553             border.color: "white"
 554             border.width: battery_volt.width * 0.01
 555             radius: border.width * 4
 556
 557             Text {
 558                text: Utils.formatFlightTime(UAV.estimatedFlightTimeValue())
 559                anchors.centerIn: parent
 560                color: "white"
 561                font {
 562                    family: pt_bold.name
 563                    pixelSize: Math.floor(parent.height * 0.6)
 564                }
 565             }
 566         }
 567     }
 568
 569     SvgElementImage {
 570         id: battery_labels
 571         elementName: "battery-labels"
 572         sceneSize: panels.sceneSize
 573         y: Math.floor(scaledBounds.y * sceneItem.height)
 574         z: battery_bg.z+5
 575
 576         states: State {
 577              name: "fading"
 578              when: show_panels == true
 579              PropertyChanges { target: battery_labels; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 580         }
 581
 582         transitions: Transition {
 583             SequentialAnimation {
 584                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 585             }
 586         }
 587     }
 588
 589     SvgElementImage {
 590         id: battery_mousearea
 591         elementName: "battery-panel-mousearea"
 592         sceneSize: panels.sceneSize
 593         y: Math.floor(scaledBounds.y * sceneItem.height)
 594         z: battery_bg.z+6
 595
 596         TooltipArea {
 597             text: "Battery panel"
 598         }
 599
 600         MouseArea {
 601              id: hidedisp_battery;
 602              anchors.fill: parent;
 603              cursorShape: Qt.PointingHandCursor
 604              onClicked: hide_display_battery()
 605         }
 606
 607         states: State {
 608              name: "fading"
 609              when: show_panels == true
 610              PropertyChanges { target: battery_mousearea; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 611         }
 612
 613         transitions: Transition {
 614             SequentialAnimation {
 615                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 616             }
 617         }
 618     }
 619
 620     //
 621     // OPLM panel
 622     //
 623
 624     SvgElementImage {
 625         id: oplm_bg
 626         elementName: "oplm-bg"
 627         sceneSize: panels.sceneSize
 628         y: Math.floor(scaledBounds.y * sceneItem.height)
 629         z: 30
 630
 631         states: State {
 632              name: "fading"
 633              when: show_panels == true
 634              PropertyChanges { target: oplm_bg; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 635         }
 636
 637         transitions: Transition {
 638             SequentialAnimation {
 639                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 640             }
 641         }
 642     }
 643
 644     SvgElementImage {
 645         id: smeter_bg
 646         elementName: "smeter-bg"
 647         sceneSize: panels.sceneSize
 648         y: Math.floor(scaledBounds.y * sceneItem.height)
 649         z: oplm_bg.z + 1
 650
 651         states: State {
 652              name: "fading"
 653              when: show_panels == true
 654              PropertyChanges { target: smeter_bg; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 655         }
 656
 657         transitions: Transition {
 658             SequentialAnimation {
 659                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 660             }
 661         }
 662     }
 663
 664     SvgElementImage {
 665         id: smeter_scale
 666         elementName: "smeter-scale"
 667         sceneSize: panels.sceneSize
 668         y: Math.floor(scaledBounds.y * sceneItem.height)
 669         z: oplm_bg.z + 2
 670
 671         states: State {
 672              name: "fading"
 673              when: show_panels == true
 674              PropertyChanges { target: smeter_scale; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 675         }
 676
 677         transitions: Transition {
 678             SequentialAnimation {
 679                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 680             }
 681         }
 682     }
 683
 684     SvgElementImage {
 685         id: smeter_needle
 686         elementName: "smeter-needle"
 687         sceneSize: panels.sceneSize
 688         y: Math.floor(scaledBounds.y * sceneItem.height)
 689         z: oplm_bg.z + 3
 690
 691         states: State {
 692              name: "fading"
 693              when: show_panels == true
 694              PropertyChanges { target: smeter_needle; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 695         }
 696
 697         transitions: Transition {
 698             SequentialAnimation {
 699                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 700             }
 701         }
 702
 703         transform: Rotation {
 704             angle: smeter_angle.toFixed(1)
 705             origin.y : smeter_needle.height
 706         }
 707     }
 708
 709     SvgElementImage {
 710         id: smeter_mask
 711         elementName: "smeter-mask"
 712         sceneSize: panels.sceneSize
 713         //y: Math.floor(scaledBounds.y * sceneItem.height)
 714         width: smeter_scale.width * 1.09
 715         //anchors.horizontalCenter: smeter_scale
 716
 717         z: oplm_bg.z + 4
 718
 719         states: State {
 720              name: "fading"
 721              when: show_panels == true
 722              PropertyChanges { target: smeter_mask; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 723         }
 724
 725         transitions: Transition {
 726             SequentialAnimation {
 727                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 728             }
 729         }
 730     }
 731
 732     SvgElementImage {
 733         id: oplm_id_label
 734         elementName: "oplm-id-label"
 735         sceneSize: panels.sceneSize
 736         y: Math.floor(scaledBounds.y * sceneItem.height)
 737         z: oplm_bg.z + 6
 738
 739         states: State {
 740              name: "fading"
 741              when: show_panels == true
 742              PropertyChanges { target: oplm_id_label; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 743         }
 744
 745         transitions: Transition {
 746             SequentialAnimation {
 747                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 748             }
 749         }
 750     }
 751
 752     SvgElementPositionItem {
 753         id: oplm_id_text
 754         sceneSize: panels.sceneSize
 755         elementName: "oplm-id-text"
 756         z: oplm_bg.z + 7
 757
 758         width: scaledBounds.width * sceneItem.width
 759         height: scaledBounds.height * sceneItem.height
 760         y: scaledBounds.y * sceneItem.height
 761
 762         states: State {
 763              name: "fading"
 764              when: show_panels == true
 765              PropertyChanges { target: oplm_id_text; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 766         }
 767
 768         transitions: Transition {
 769             SequentialAnimation {
 770                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 771             }
 772         }
 773
 774         Text {
 775              text: (UAV.oplmDeviceID() > 0) ? UAV.oplmDeviceID().toString(16) : "--  --  --  --"
 776              anchors.centerIn: parent
 777              color: "white"
 778              font {
 779                  family: pt_bold.name
 780                  pixelSize: Math.floor(parent.height * 1.4)
 781                  weight: Font.DemiBold
 782                  capitalization: Font.AllUppercase
 783              }
 784         }
 785     }
 786
 787     SvgElementImage {
 788         id: rx_quality_label
 789         elementName: "rx-quality-label"
 790         sceneSize: panels.sceneSize
 791         y: Math.floor(scaledBounds.y * sceneItem.height)
 792         z: oplm_bg.z + 8
 793
 794         states: State {
 795              name: "fading"
 796              when: show_panels == true
 797              PropertyChanges { target: rx_quality_label; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 798         }
 799
 800         transitions: Transition {
 801             SequentialAnimation {
 802                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 803             }
 804         }
 805     }
 806
 807     SvgElementPositionItem {
 808         id: rx_quality_text
 809         sceneSize: panels.sceneSize
 810         elementName: "rx-quality-text"
 811         z: oplm_bg.z + 9
 812
 813         width: scaledBounds.width * sceneItem.width
 814         height: scaledBounds.height * sceneItem.height
 815         y: scaledBounds.y * sceneItem.height
 816
 817         states: State {
 818              name: "fading"
 819              when: show_panels == true
 820              PropertyChanges { target: rx_quality_text; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 821         }
 822
 823         transitions: Transition {
 824             SequentialAnimation {
 825                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 826             }
 827         }
 828
 829         Text {
 830              text: UAV.receiverQuality()
 831              anchors.right: parent.right
 832              color: "white"
 833              font {
 834                  family: pt_bold.name
 835                  pixelSize: Math.floor(parent.height * 1.4)
 836                  weight: Font.DemiBold
 837              }
 838         }
 839     }
 840
 841     SvgElementImage {
 842         id: cnx_state_label
 843         elementName: "cnx-state-label"
 844         sceneSize: panels.sceneSize
 845         y: Math.floor(scaledBounds.y * sceneItem.height)
 846         z: oplm_bg.z + 8
 847
 848         states: State {
 849              name: "fading"
 850              when: show_panels == true
 851              PropertyChanges { target: cnx_state_label; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 852         }
 853
 854         transitions: Transition {
 855             SequentialAnimation {
 856                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 857             }
 858         }
 859     }
 860
 861     SvgElementPositionItem {
 862         id: cnx_state_text
 863         sceneSize: panels.sceneSize
 864         elementName: "cnx-state-text"
 865         z: oplm_bg.z + 9
 866
 867         width: scaledBounds.width * sceneItem.width
 868         height: scaledBounds.height * sceneItem.height
 869         y: scaledBounds.y * sceneItem.height
 870
 871         states: State {
 872              name: "fading"
 873              when: show_panels == true
 874              PropertyChanges { target: cnx_state_text; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 875         }
 876
 877         transitions: Transition {
 878             SequentialAnimation {
 879                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 880             }
 881         }
 882
 883         Text {
 884              text: UAV.oplmLinkState()
 885              anchors.right: parent.right
 886              color: "white"
 887              font {
 888                  family: pt_bold.name
 889                  pixelSize: Math.floor(parent.height * 1.4)
 890                  weight: Font.DemiBold
 891              }
 892         }
 893     }
 894
 895     SvgElementImage {
 896         id: oplm_mousearea
 897         elementName: "oplm-panel-mousearea"
 898         sceneSize: panels.sceneSize
 899         y: Math.floor(scaledBounds.y * sceneItem.height)
 900         z: oplm_bg.z
 901
 902         TooltipArea {
 903             text: "Link panel"
 904         }
 905
 906         MouseArea {
 907              id: hidedisp_oplm;
 908              anchors.fill: parent;
 909              cursorShape: Qt.PointingHandCursor
 910              onClicked: hide_display_oplink()
 911         }
 912
 913         states: State {
 914              name: "fading"
 915              when: show_panels == true
 916              PropertyChanges { target: oplm_mousearea; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 917         }
 918
 919         transitions: Transition {
 920             SequentialAnimation {
 921                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 922             }
 923         }
 924     }
 925
 926     //
 927     // System panel
 928     //
 929
 930     SvgElementImage {
 931         id: system_bg
 932         elementName: "system-bg"
 933         sceneSize: panels.sceneSize
 934         y: scaledBounds.y * sceneItem.height
 935         z: 40
 936
 937         states: State {
 938              name: "fading"
 939              when: show_panels == true
 940              PropertyChanges { target: system_bg; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 941         }
 942
 943         transitions: Transition {
 944             SequentialAnimation {
 945                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 946             }
 947         }
 948     }
 949
 950     SvgElementPositionItem {
 951         id: system_frametype
 952         elementName: "system-frame-type"
 953         sceneSize: panels.sceneSize
 954         y: scaledBounds.y * sceneItem.height
 955         z: system_bg.z + 1
 956
 957         states: State {
 958              name: "fading"
 959              when: show_panels == true
 960              PropertyChanges { target: system_frametype; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 961         }
 962
 963         transitions: Transition {
 964             SequentialAnimation {
 965                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 966             }
 967         }
 968
 969         Text {
 970              text: UAV.frameType()
 971              anchors.right: parent.right
 972              color: "white"
 973              font {
 974                  family: pt_bold.name
 975                  pixelSize: Math.floor(parent.height * 1.4)
 976                  weight: Font.DemiBold
 977              }
 978         }
 979     }
 980
 981     SvgElementPositionItem {
 982         id: system_cpuloadtemp
 983         elementName: "system-cpu-load-temp"
 984         sceneSize: panels.sceneSize
 985         y: scaledBounds.y * sceneItem.height
 986         z: system_bg.z + 1
 987
 988         states: State {
 989              name: "fading"
 990              when: show_panels == true
 991              PropertyChanges { target: system_cpuloadtemp; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
 992         }
 993
 994         transitions: Transition {
 995             SequentialAnimation {
 996                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
 997             }
 998         }
 999
1000         Text {
1001              // CC3D: Only display Cpu load, no temperature available.
1002              text: UAV.cpuLoad() + "%" + [UAV.isCC3D() ? "" : " | " + UAV.cpuTemp() + "°C"]
1003              anchors.right: parent.right
1004              color: "white"
1005              font {
1006                  family: pt_bold.name
1007                  pixelSize: Math.floor(parent.height * 1.4)
1008                  weight: Font.DemiBold
1009              }
1010         }
1011     }
1012
1013     SvgElementPositionItem {
1014         id: system_memfree
1015         elementName: "system-mem-free"
1016         sceneSize: panels.sceneSize
1017         y: scaledBounds.y * sceneItem.height
1018         z: system_bg.z + 1
1019
1020         states: State {
1021              name: "fading"
1022              when: show_panels == true
1023              PropertyChanges { target: system_memfree; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
1024         }
1025
1026         transitions: Transition {
1027             SequentialAnimation {
1028                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
1029             }
1030         }
1031
1032         Text {
1033              text: UAV.freeMemory()
1034              anchors.right: parent.right
1035              color: "white"
1036              font {
1037                  family: pt_bold.name
1038                  pixelSize: Math.floor(parent.height * 1.4)
1039                  weight: Font.DemiBold
1040              }
1041         }
1042     }
1043
1044     SvgElementPositionItem {
1045         id: system_fusion_algo
1046         elementName: "system-attitude-estimation-algo"
1047         sceneSize: panels.sceneSize
1048         y: scaledBounds.y * sceneItem.height
1049         z: system_bg.z + 1
1050
1051         states: State {
1052              name: "fading"
1053              when: show_panels == true
1054              PropertyChanges { target: system_fusion_algo; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
1055         }
1056
1057         transitions: Transition {
1058             SequentialAnimation {
1059                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
1060             }
1061         }
1062
1063         Text {
1064              text: UAV.fusionAlgorithm()
1065              anchors.right: parent.right
1066              color: "white"
1067              font {
1068                  family: pt_bold.name
1069                  pixelSize: Math.floor(parent.height * 1.35)
1070                  weight: Font.DemiBold
1071              }
1072         }
1073     }
1074
1075     SvgElementPositionItem {
1076         id: system_mag_used
1077         elementName: "system-mag-used"
1078         sceneSize: panels.sceneSize
1079         y: scaledBounds.y * sceneItem.height
1080         z: system_bg.z + 1
1081
1082         states: State {
1083              name: "fading"
1084              when: show_panels == true
1085              PropertyChanges { target: system_mag_used; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
1086         }
1087
1088         transitions: Transition {
1089             SequentialAnimation {
1090                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
1091             }
1092         }
1093
1094         Text {
1095              text: UAV.magSourceName()
1096              anchors.right: parent.right
1097              color: "white"
1098              font {
1099                  family: pt_bold.name
1100                  pixelSize: Math.floor(parent.height * 1.4)
1101                  weight: Font.DemiBold
1102              }
1103         }
1104     }
1105
1106     SvgElementPositionItem {
1107         id: system_gpstype
1108         elementName: "system-gps-type"
1109         sceneSize: panels.sceneSize
1110         y: scaledBounds.y * sceneItem.height
1111         z: system_bg.z + 1
1112
1113         states: State {
1114              name: "fading"
1115              when: show_panels == true
1116              PropertyChanges { target: system_gpstype; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
1117         }
1118
1119         transitions: Transition {
1120             SequentialAnimation {
1121                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
1122             }
1123         }
1124
1125         Text {
1126              text: UAV.gpsSensorType()
1127              anchors.right: parent.right
1128              color: "white"
1129              font {
1130                  family: pt_bold.name
1131                  pixelSize: Math.floor(parent.height * 1.4)
1132                  weight: Font.DemiBold
1133              }
1134         }
1135     }
1136
1137     SvgElementImage {
1138         id: system_mousearea
1139         elementName: "system-panel-mousearea"
1140         sceneSize: panels.sceneSize
1141         y: Math.floor(scaledBounds.y * sceneItem.height)
1142         z: system_bg.z + 1
1143
1144         TooltipArea {
1145             text: "System panel"
1146         }
1147
1148         MouseArea {
1149              id: hidedisp_system;
1150              anchors.fill: parent;
1151              cursorShape: Qt.PointingHandCursor
1152              onClicked: hide_display_system()
1153         }
1154
1155         states: State {
1156              name: "fading"
1157              when: show_panels == true
1158              PropertyChanges { target: system_mousearea; x: Math.floor(scaledBounds.x * sceneItem.width) + offset_value; }
1159         }
1160
1161         transitions: Transition {
1162             SequentialAnimation {
1163                 PropertyAnimation { property: "x"; easing.type: anim_type; duration: anim_duration }
1164             }
1165         }
1166     }
1167 }