From 351cfcf16c96ad492b7657ac7d22856822dc2170 Mon Sep 17 00:00:00 2001
From: Frederick Borges <fborges@opennebula.io>
Date: Thu, 17 Mar 2022 17:02:56 +0100
Subject: [PATCH] B #5771: Fix disk size sliders (#1851)

(cherry picked from commit da1afee61c2efe433a341017935f62cea44d8c8d)
---
 .../app/tabs/vms-tab/dialogs/disk-resize.js   | 12 +++++---
 src/sunstone/public/app/utils/disks-resize.js |  2 +-
 src/sunstone/public/app/utils/range-slider.js | 29 +++++++++++++++++--
 3 files changed, 36 insertions(+), 7 deletions(-)

diff --git a/src/sunstone/public/app/tabs/vms-tab/dialogs/disk-resize.js b/src/sunstone/public/app/tabs/vms-tab/dialogs/disk-resize.js
index 3cbde79c43..60ed143610 100644
--- a/src/sunstone/public/app/tabs/vms-tab/dialogs/disk-resize.js
+++ b/src/sunstone/public/app/tabs/vms-tab/dialogs/disk-resize.js
@@ -81,7 +81,7 @@ define(function(require) {
   function _setup(context) {
     var that = this;
     Tips.setup(context);
-    var oneTera = Humanize.sizeToMB("1024GB")*1024;
+    var oneTera = Humanize.sizeToMB("1TB")*1024;
     var max = that.diskSize > oneTera? that.diskSize*1024 : oneTera;
     var attrs = {
       min: that.diskSize,
@@ -91,11 +91,15 @@ define(function(require) {
       max_value: "",
       type: "range",
       no_ticks: true
-  }
+    }
     //$( ".diskSlider", context).html(RangeSlider.html(attrs));
-    UserInputs.insertAttributeInputMB(attrs, $(".diskSlider", context))
+
+    // Functions for disks slider
+
+    UserInputs.insertAttributeInputMB(attrs, $(".diskSlider", context));
+
     $( ".uinput-slider-val",context).prop('type', 'text');
-    $( ".uinput-slider-val",context).val(Humanize.size($( ".uinput-slider",context).val()));
+    $( ".uinput-slider-val",context).val(Humanize.size($(".uinput-slider",context).val()));
 
     $( ".uinput-slider", context).on("input", function(){
       $( ".uinput-slider-val",context).val(Humanize.size($( ".uinput-slider",context).val()));
diff --git a/src/sunstone/public/app/utils/disks-resize.js b/src/sunstone/public/app/utils/disks-resize.js
index 8bb55a8aa6..6656107406 100644
--- a/src/sunstone/public/app/utils/disks-resize.js
+++ b/src/sunstone/public/app/utils/disks-resize.js
@@ -194,7 +194,7 @@ define(function(require){
           if (disk.SIZE != undefined){
             // Range from original size to size + 500GB
             var min = parseInt(disk.SIZE);
-            var max = min + Humanize.sizeToMB("1024GB");
+            var max = min + Humanize.sizeToMB("1TB");
 
             attr = UserInputs.parse(
               "SIZE",
diff --git a/src/sunstone/public/app/utils/range-slider.js b/src/sunstone/public/app/utils/range-slider.js
index c7487ef46a..a9663496ac 100644
--- a/src/sunstone/public/app/utils/range-slider.js
+++ b/src/sunstone/public/app/utils/range-slider.js
@@ -78,8 +78,33 @@ define(function(require) {
     $(document).off("input", "input.uinput-slider");
     $(document).on("input", "input.uinput-slider", function(){
       //change selector to MB
-      $(".mb_input_unit", $(this).closest('.mb_input_wrapper')).val("MB");
-      $("input[type=number]", $(this).closest('.uinput-slider-container')).val( this.value );
+      var base = 1024;
+      var baseCal = 1;
+      var unit = "MB";
+      var valueInMB = 0;
+      // Fill in the input with your unit the first time
+      var value = $(this).val();
+      var valueInUnit = value;
+      var min = parseInt($(this).attr("min"),10);
+
+      if(value / (base*base) >= 1){
+        baseCal = base*base;
+        unit = "TB";
+      }else if(value / base >= 1){
+        baseCal = base;
+        unit = "GB";
+      }
+      if (value >= 0) {
+        valueInMB = value;
+        if(!isNaN(min) && parseInt(min, 10) > valueInMB ){
+          valueInMB = min;
+        }
+        $("input, select", $(this).closest('.uinput-slider-container')).val(valueInMB);
+        $(".uinput-slider-val", $(this).closest('.uinput-slider-container')).trigger("change");
+        valueInUnit = valueInMB / baseCal;
+      }
+      $("input.visor", $(this).closest('.uinput-slider-container')).val(valueInUnit);
+      $(".mb_input_unit", $(this).closest('.mb_input_wrapper')).val(unit).trigger("change");
     });
   }
 });