Skip to content

Commit

Permalink
Docs: add Max example for Progress component
Browse files Browse the repository at this point in the history
  • Loading branch information
stsrki committed Nov 25, 2024
1 parent 066e0f7 commit 2644728
Show file tree
Hide file tree
Showing 4 changed files with 134 additions and 0 deletions.
40 changes: 40 additions & 0 deletions Documentation/Blazorise.Docs/Models/Snippets.generated.cs
Original file line number Diff line number Diff line change
Expand Up @@ -3639,6 +3639,46 @@ private void SetActive(string page)
<ProgressBar Color=""Color.Info"" Value=""20"" />
</Progress>";

public const string ProgressWithMaxExample = @"@using System.Timers
@implements IDisposable

<Field>
<FieldBody>
<Progress Max=""42"" Value=""@Value"" />
</FieldBody>
<FieldHelp>
There have been @Value files downloaded
</FieldHelp>
</Field>

@code {
private int Value = 0;
private Timer timer;

private const int IntervalDelay = 100; // milliseconds
private const int IntervalIncrement = 1;

protected override void OnInitialized()
{
timer = new Timer(IntervalDelay);
timer.Elapsed += OnTimerElapsed;
timer.AutoReset = true;
timer.Start();
}

private void OnTimerElapsed(object sender, ElapsedEventArgs e)
{
Value = Value < 42 ? Value + IntervalIncrement : 0;
InvokeAsync(StateHasChanged);
}

public void Dispose()
{
timer?.Stop();
timer?.Dispose();
}
}";

public const string BasicRadioGroupExample = @"<RadioGroup TValue=""string"" Name=""colors"">
<Radio Value=""@(""red"")"">Red</Radio>
<Radio Value=""@(""green"")"">Green</Radio>
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
<div class="blazorise-codeblock">
<div class="html"><pre>
<span class="atSign">&#64;</span>using System.Timers
<span class="atSign">&#64;</span>implements IDisposable

<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">Field</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">FieldBody</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">Progress</span> <span class="htmlAttributeName">Max</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="htmlAttributeValue">42</span><span class="quot">&quot;</span> <span class="htmlAttributeName">Value</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="sharpVariable"><span class="atSign">&#64;</span>Value</span><span class="quot">&quot;</span> <span class="htmlTagDelimiter">/&gt;</span>
<span class="htmlTagDelimiter">&lt;/</span><span class="htmlElementName">FieldBody</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">FieldHelp</span><span class="htmlTagDelimiter">&gt;</span>
There have been <span class="atSign">&#64;</span>Value files downloaded
<span class="htmlTagDelimiter">&lt;/</span><span class="htmlElementName">FieldHelp</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;/</span><span class="htmlElementName">Field</span><span class="htmlTagDelimiter">&gt;</span>
</pre></div>
<div class="csharp"><pre>
<span class="atSign">&#64;</span>code {
<span class="keyword">private</span> <span class="keyword">int</span> Value = <span class="number">0</span>;
<span class="keyword">private</span> Timer timer;

<span class="keyword">private</span> <span class="keyword">const</span> <span class="keyword">int</span> IntervalDelay = <span class="number">100</span>; <span class="comment">// milliseconds</span>
<span class="keyword">private</span> <span class="keyword">const</span> <span class="keyword">int</span> IntervalIncrement = <span class="number">1</span>;

<span class="keyword">protected</span> <span class="keyword">override</span> <span class="keyword">void</span> OnInitialized()
{
timer = <span class="keyword">new</span> Timer(IntervalDelay);
timer.Elapsed += OnTimerElapsed;
timer.AutoReset = <span class="keyword">true</span>;
timer.Start();
}

<span class="keyword">private</span> <span class="keyword">void</span> OnTimerElapsed(<span class="keyword">object</span> sender, ElapsedEventArgs e)
{
Value = Value &lt; <span class="number">42</span> ? Value + IntervalIncrement : <span class="number">0</span>;
InvokeAsync(StateHasChanged);
}

<span class="keyword">public</span> <span class="keyword">void</span> Dispose()
{
timer?.Stop();
timer?.Dispose();
}
}
</pre></div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
@namespace Blazorise.Docs.Docs.Examples
@using System.Timers
@implements IDisposable

<Field>
<FieldBody>
<Progress Max="42" Value="@Value" />
</FieldBody>
<FieldHelp>
There have been @Value files downloaded
</FieldHelp>
</Field>

@code {
private int Value = 0;
private Timer timer;

private const int IntervalDelay = 100; // milliseconds
private const int IntervalIncrement = 1;

protected override void OnInitialized()
{
timer = new Timer(IntervalDelay);
timer.Elapsed += OnTimerElapsed;
timer.AutoReset = true;
timer.Start();
}

private void OnTimerElapsed(object sender, ElapsedEventArgs e)
{
Value = Value < 42 ? Value + IntervalIncrement : 0;
InvokeAsync(StateHasChanged);
}

public void Dispose()
{
timer?.Stop();
timer?.Dispose();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,16 @@
<DocsPageSectionSource Code="IndeterminateProgressExample" />
</DocsPageSection>

<DocsPageSection>
<DocsPageSectionHeader Title="Max">
You can specify the maximum value of the determinate Progress. This is useful for instances where you want to show capacity, or how much of a total has been uploaded/downloaded.
</DocsPageSectionHeader>
<DocsPageSectionContent Outlined FullWidth>
<ProgressWithMaxExample />
</DocsPageSectionContent>
<DocsPageSectionSource Code="ProgressWithMaxExample" />
</DocsPageSection>

<DocsPageSubtitle>
Page progress
</DocsPageSubtitle>
Expand Down

0 comments on commit 2644728

Please sign in to comment.