From 5ef233fd9c9fd59d9c6f69200c3cd63d720444e2 Mon Sep 17 00:00:00 2001
From: Sergio Betanzos <sbetanzos@opennebula.io>
Date: Mon, 29 Mar 2021 12:19:30 +0200
Subject: [PATCH] B #1019: Fix visor input (#1038)

---
 .../app/tabs/provision-tab/flows/list.js      | 27 +++++++++++--------
 src/sunstone/public/scss/_provision.scss      |  1 +
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/sunstone/public/app/tabs/provision-tab/flows/list.js b/src/sunstone/public/app/tabs/provision-tab/flows/list.js
index 3619e54690..266e34cad0 100644
--- a/src/sunstone/public/app/tabs/provision-tab/flows/list.js
+++ b/src/sunstone/public/app/tabs/provision-tab/flows/list.js
@@ -473,20 +473,24 @@ define(function(require) {
 
       if (max_vms > min_vms) {
         $( ".cardinality_slider_div", context).html(RangeSlider.html({
-            min: min_vms,
-            max: max_vms,
-            max_value: max_vms,
-            initial: role.cardinality,
-            label: Locale.tr("Number of VMs for Role")+" "+role.name
-          }));
+          min: min_vms,
+          max: max_vms,
+          max_value: max_vms,
+          initial: role.cardinality,
+          label: Locale.tr("Number of VMs for Role")+" "+role.name
+        }));
 
-        $( ".cardinality_slider_div", context).show();
+        $(".cardinality_slider_div input.visor", context).off().on('input', function() {
+          $("input[type=range]", $(this).closest('.uinput-slider-container')).val( this.value );
+        });
+
+        $(".cardinality_slider_div", context).show();
         $(".provision_change_cardinality_button").show();
-        $( ".cardinality_no_slider_div", context).hide();
+        $(".cardinality_no_slider_div", context).hide();
       } else {
-        $( ".cardinality_slider_div", context).hide();
+        $(".cardinality_slider_div", context).hide();
         $(".provision_change_cardinality_button").hide();
-        $( ".cardinality_no_slider_div", context).show();
+        $(".cardinality_no_slider_div", context).show();
       }
 
       return false;
@@ -495,13 +499,14 @@ define(function(require) {
     context.on("click", ".provision_change_cardinality_button", function() {
       var flow_id = $(".provision_info_flow", context).attr("flow_id");
       var role_name = $(this).attr("role_id")
+      var cardinality = $(".cardinality_slider_div", context).val()
 
       OpenNebula.Role.scale({
         data : {
           id: flow_id,
           extra_param: {
             force: false,
-            cardinality: $(".visor", ".cardinality_slider_div", context).val(),
+            cardinality: cardinality,
             role_name: role_name,
           }
         },
diff --git a/src/sunstone/public/scss/_provision.scss b/src/sunstone/public/scss/_provision.scss
index a697f6a6fe..100f20f9aa 100644
--- a/src/sunstone/public/scss/_provision.scss
+++ b/src/sunstone/public/scss/_provision.scss
@@ -11,6 +11,7 @@
   img {
     max-height: 2.5rem;
     max-width: 120px;
+    margin-right: 2rem;
   }
 
   & > li > a {