free shipping and discount progress bar on cart page

[Sammy9]

Please help me I need to create the same progress bar and should be working within the cart page (should not need to reload again and again) and it should be in (£) here is what I have done so far please help me 

{% if cart.total_price <= 10000 %}

{% assign barvalue1 = cart.total_price %}
{% assign barvalue2 = 0 %}
{% assign barvalue3 = 0 %}
{% capture my_variable55 %}You are just <b>{{10000 | minus: cart.total_price | money}}</b> away from <b>free shipping</b>{% endcapture %}

{% elsif cart.total_price <= 25000 %}

{% assign barvalue1 = 10000 %}
{% assign barvalue2 = cart.total_price %}
{% assign barvalue3 = 0 %}
{% capture my_variable55 %}You are just <b>{{25000 | minus: cart.total_price | money}}</b> away from <b>20% Discount</b>{% endcapture %}

{% elsif cart.total_price <= 45000 %}

{% assign barvalue1 = 10000 %}
{% assign barvalue2 = 25000 %}
{% assign barvalue3 = cart.total_price %}
{% capture my_variable55 %}You are just <b>{{45000 | minus: cart.total_price | money}}</b> away from <b>25% Discount</b>{% endcapture %}

{% else %}

{% assign barvalue1 = 10000 %}
{% assign barvalue2 = 25000 %}
{% assign barvalue3 = 45000 %}

{% endif %}

<div style="text-align: center;">
<div style="margin-top:25px; margin-bottom:30px;color:white;"> {{ my_variable55 }} </div>
<div style="--top-bar-background:#00848e; --top-bar-background-lighter:#1d9ba4; --top-bar-color:#f9fafb; --p-frame-offset:0px;">
<div class="Polaris-ProgressBar Polaris-ProgressBar--sizeLarge"><progress class="Polaris-ProgressBar__Progress" value="{{barvalue1}}" max="10000"></progress><progress class="Polaris-ProgressBar__Progress" value="{{barvalue2}}" max="25000"></progress><progress class="Polaris-ProgressBar__Progress" value="{{barvalue3}}" max="45000"></progress>
<div class="Polaris-ProgressBar__Indicator" style="width: 100%;"><span style="margin-left: -5%;color:white;" class="Polaris-ProgressBar__Label">Free Shipping</span><span style="margin-left: 8%;color:white;" class="Polaris-ProgressBar__Label">20% Discount</span><span style="margin-left: 8%;color:white;" class="Polaris-ProgressBar__Label">25% Discount</span></div>
</div>
</div>

</div>

[AvadaCommerce]

Hi @Sammy9 

I would love to suggest to you the app AVA Trust Badges, Sales Pop. 
This app helps create Free Shipping Bar with progress easily, without coding. 
And you can select the page to show Free Shipping Bar. 

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any questions!