# AUI Progress Bar 2

## Description

The AUI Pogress Bar 2 is a newer implementation of Atlassian that also allows for an indeterminate state, displayed as a bouncing progress bar.

<figure><img src="/files/CPTrx7kUdaXTJtzQ3bf7" alt=""><figcaption></figcaption></figure>

## Adding the Macro

1. Edit your page.
2. Select “+” => Other macros
3. Type in “aui” in the Search box
4. Select the “AUI Progress Bar 2” macro

## Macro Options

<figure><img src="/files/Z82BkMhTmbQbxmmZSaiH" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
The progress bar will not show in the preview section. Save the page to see the result.
{% endhint %}

### **ID**

Enter a unique ID for this object on your page. The macro is not using it though. But you can use it to address the progress bar with an external Javascript.

Using the Confluence jQuery implementation you can adjust the progress bar like this:

```javascript
let progress = document.getElementById("my-progress-bar2");
progress.max = 42;
progress.value = 7;
```

### **Progress**

Enter the progress value in relation to the Max Value.The Max Value is set to 100 per default which in most cases is what you want, representing 100%. In that case, if you want to display a 52% progress, enter 52 here.

### **Max Value**

The Max Value is set to 100 per default which in most cases is what you want, representing 100%. Depending on your use case, you might want to chose a different value. You can do so here. Make sure you adjust your progress value accordingly.

### **Width**

You can enter a fixed width here, e.g. 400px.

Note: The height cannot be adjusted for this type of progress bar.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://lewe.gitbook.io/html-and-aui-toolkit-for-confluence/aui-macros/aui-progress-bar-2.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
