Skip to content

Commit f362fdc

Browse files
gvreddy04gvreddy04
authored
Documentation updated (#4)
* Prism code highlight + docs updated
1 parent 0437cc2 commit f362fdc

6 files changed

Lines changed: 146 additions & 81 deletions

File tree

‎BlazorExpress.ChartJS.Demo.RCL/Components/Pages/GettingStarted/GettingStarted.razor‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,19 +11,19 @@
1111
<div class="mb-3">
1212
Looking to quickly add <b>BlazorExpress.ChartJS</b> to your project? Use NuGet package manager.
1313
</div>
14-
<CodeSnippet File="~\Components\Pages\GettingStarted\Getting_Started_Snippet_01_Install.txt" />
14+
<Snippet LanguageCode="LanguageCode.PowerShell" FilePath="~\Components\Pages\GettingStarted\Getting_Started_Snippet_01_Install.txt" />
1515

1616
<SectionHeading Size="HeadingSize.H4" Text="Add script references" PageUrl="@pageUrl" HashTagName="add-script-references" />
1717
<div class="mb-3">
1818
Insert the following references into the <b>body</b> section of the <b>wwwroot/index.html</b> file, immediately after the <b>_framework/blazor.webassembly.js</b> reference:
1919
</div>
20-
<CodeSnippet File="~\Components\Pages\GettingStarted\Getting_Started_Snippet_02_Scripts.html" />
20+
<Snippet LanguageCode="LanguageCode.JavaScript" FilePath="~\Components\Pages\GettingStarted\Getting_Started_Snippet_02_Scripts.html" />
2121

2222
<SectionHeading Size="HeadingSize.H4" Text="Register services" PageUrl="@pageUrl" HashTagName="register-services" />
2323
<div class="mb-3">
2424
Register tag helpers in <b>_Imports.razor</b>.
2525
</div>
26-
<CodeSnippet File="~\Components\Pages\GettingStarted\Getting_Started_Snippet_03_Register.txt" />
26+
<Snippet LanguageCode="LanguageCode.Razor" FilePath="~\Components\Pages\GettingStarted\Getting_Started_Snippet_03_Register.txt" />
2727

2828
@code {
2929
private const string pageUrl = "/charts/getting-started";

‎BlazorExpress.ChartJS.Demo.RCL/Components/Shared/Demo.razor‎

Lines changed: 13 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
@namespace BlazorExpress.ChartJS.Demo.RCL
33
@inherits ComponentBase
44

5-
<!--googleoff: index-->
65
@if (ShowCodeOnly)
76
{
87
<div class="bd-example-snippet bd-code-snippet">
@@ -16,10 +15,10 @@
1615
</div>
1716
<div class="highlight">
1817
<pre>
19-
<code class="@LanguageCssClass">
20-
@if (codeSnippet is not null)
18+
<code class="@LanguageCode.ToLanguageCssClass()">
19+
@if (snippet is not null)
2120
{
22-
<text>@codeSnippet.Trim()</text>
21+
<text>@snippet.Trim()</text>
2322
}
2423
</code>
2524
</pre>
@@ -42,10 +41,10 @@ else if (!Tabs)
4241
</div>
4342
<div class="highlight">
4443
<pre>
45-
<code class="@LanguageCssClass">
46-
@if (codeSnippet is not null)
44+
<code class="@LanguageCode.ToLanguageCssClass()">
45+
@if (snippet is not null)
4746
{
48-
<text>@codeSnippet.Trim()</text>
47+
<text>@snippet.Trim()</text>
4948
}
5049
</code>
5150
</pre>
@@ -57,7 +56,7 @@ else // Tabs = true
5756
<Tabs EnableFadeEffect="true">
5857
<Tab Active="true">
5958
<TitleTemplate>
60-
<Icon Name="IconName.Display" Class="me-2" /><b>Demo</b>
59+
<Icon Name="IconName.Display" Class="me-2" /><b>Example</b>
6160
</TitleTemplate>
6261
<Content>
6362
<div class="bb-example border-top-0 mt-0">
@@ -67,7 +66,7 @@ else // Tabs = true
6766
</Tab>
6867
<Tab>
6968
<TitleTemplate>
70-
<Icon Name="IconName.CodeSlash" Class="me-2" /><b>Source</b>
69+
<Icon Name="IconName.CodeSlash" Class="me-2" /><b>View Source</b>
7170
</TitleTemplate>
7271
<Content>
7372
<div class="position-relative d-block float-end mt-3 me-3 me-sm-4">
@@ -77,16 +76,15 @@ else // Tabs = true
7776
</div>
7877
<div class="highlight">
7978
<pre class="mt-0 me-4">
80-
<code class="@LanguageCssClass">
81-
@if (codeSnippet is not null)
79+
<code class="@LanguageCode.ToLanguageCssClass()">
80+
@if (snippet is not null)
8281
{
83-
<text>@codeSnippet.Trim()</text>
82+
<text>@snippet.Trim()</text>
8483
}
85-
</code>
86-
</pre>
84+
</code>
85+
</pre>
8786
</div>
8887
</Content>
8988
</Tab>
9089
</Tabs>
9190
}
92-
<!--googleon: index-->

‎BlazorExpress.ChartJS.Demo.RCL/Components/Shared/Demo.razor.cs‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ public partial class Demo : ComponentBase
1010

1111
private string? clipboardTooltipTitle = "Copy to clipboard";
1212

13-
private string? codeSnippet;
13+
private string? snippet;
1414

1515
/// <summary>
1616
/// A reference to this component instance for use in JavaScript calls.
@@ -37,11 +37,11 @@ protected override async Task OnInitializedAsync()
3737

3838
protected override async Task OnParametersSetAsync()
3939
{
40-
if (codeSnippet is null)
40+
if (snippet is null)
4141
{
42-
var resourceName = Type.FullName + ".razor";
42+
var resourceFullName = Type.FullName + ".razor";
4343

44-
using (var stream = Type.Assembly.GetManifestResourceStream(resourceName)!)
44+
using (var stream = Type.Assembly.GetManifestResourceStream(resourceFullName)!)
4545
{
4646
try
4747
{
@@ -50,7 +50,7 @@ protected override async Task OnParametersSetAsync()
5050

5151
using (var reader = new StreamReader(stream))
5252
{
53-
codeSnippet = await reader.ReadToEndAsync();
53+
snippet = await reader.ReadToEndAsync();
5454
}
5555
}
5656
catch (Exception ex)
@@ -97,15 +97,15 @@ public void ResetCopyStatusJS()
9797
StateHasChanged();
9898
}
9999

100-
private async Task CopyToClipboardAsync() => await JS.InvokeVoidAsync("copyToClipboard", codeSnippet, objRef);
100+
private async Task CopyToClipboardAsync() => await JS.InvokeVoidAsync("copyToClipboard", snippet, objRef);
101101

102102
#endregion
103103

104104
#region Properties, Indexers
105105

106106
[Inject] protected IJSRuntime JS { get; set; } = default!;
107107

108-
[Parameter] public string LanguageCssClass { get; set; } = "language-cshtml";
108+
[Parameter] public LanguageCode LanguageCode { get; set; } = LanguageCode.Razor;
109109

110110
[Parameter] public bool ShowCodeOnly { get; set; }
111111

‎BlazorExpress.ChartJS.Demo.RCL/Components/Shared/Enums/LanguageCode.cs‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
namespace BlazorExpress.ChartJS.Demo.RCL;
2+
3+
/// <summary>
4+
/// <see href="https://prismjs.com/#supported-languages" />
5+
/// </summary>
6+
public enum LanguageCode
7+
{
8+
/// <summary>
9+
/// ASP.NET (C#) - aspnet
10+
/// </summary>
11+
AspNet,
12+
13+
/// <summary>
14+
/// C# - csharp, cs, dotnet
15+
/// </summary>
16+
CSharp,
17+
18+
/// <summary>
19+
/// CSS - css
20+
/// </summary>
21+
Css,
22+
23+
/// <summary>
24+
/// HTML - html
25+
/// </summary>
26+
HTML,
27+
28+
/// <summary>
29+
/// JavaScript - javascript, js
30+
/// </summary>
31+
JavaScript,
32+
33+
/// <summary>
34+
/// JSON - json
35+
/// </summary>
36+
JSON,
37+
38+
/// <summary>
39+
/// JSONP - jsonp
40+
/// </summary>
41+
JSONP,
42+
43+
/// <summary>
44+
/// Markdown - md
45+
/// </summary>
46+
Markdown,
47+
48+
/// <summary>
49+
/// PowerShell - powershell
50+
/// </summary>
51+
PowerShell,
52+
53+
/// <summary>
54+
/// Razor C# - cshtml, razor
55+
/// </summary>
56+
Razor,
57+
58+
/// <summary>
59+
/// Text - none
60+
/// </summary>
61+
Text,
62+
63+
/// <summary>
64+
/// YAML - yaml, yml
65+
/// </summary>
66+
YAML
67+
}
68+

‎BlazorExpress.ChartJS.Demo.RCL/Components/Shared/Extensions/EnumExtensions.cs‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
namespace BlazorExpress.ChartJS.Demo.RCL;
2+
3+
public static class EnumExtensions
4+
{
5+
public static string? ToLanguageCssClass(this LanguageCode languageCode) =>
6+
languageCode switch
7+
{
8+
LanguageCode.AspNet => "language-aspnet",
9+
LanguageCode.CSharp => "language-csharp",
10+
LanguageCode.JavaScript => "language-js",
11+
LanguageCode.JSON => "language-json",
12+
LanguageCode.JSONP => "language-jsonp",
13+
LanguageCode.Markdown => "language-md",
14+
LanguageCode.PowerShell => "language-powershell",
15+
LanguageCode.Razor => "language-razor",
16+
LanguageCode.Text => "language-none",
17+
LanguageCode.YAML => "language-yaml",
18+
_ => null
19+
};
20+
}

BlazorExpress.ChartJS.Demo.RCL/Components/Shared/CodeSnippet.cs renamed to BlazorExpress.ChartJS.Demo.RCL/Components/Shared/Snippet.cs

Lines changed: 35 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,50 @@
11
namespace BlazorExpress.ChartJS.Demo.RCL;
22

3-
public class CodeSnippet : ComponentBase
3+
public class Snippet : ComponentBase
44
{
55
#region Members
66

7-
private string? code;
7+
private string? snippet;
88

99
#endregion
1010

1111
#region Methods
1212

13+
protected override void BuildRenderTree(RenderTreeBuilder builder)
14+
{
15+
builder.OpenElement(300, "div");
16+
builder.AddAttribute(301, "class", "highlight show-code-only");
17+
18+
builder.OpenElement(400, "pre");
19+
20+
builder.OpenElement(500, "code");
21+
builder.AddAttribute(501, "class", LanguageCode.ToLanguageCssClass());
22+
23+
if (snippet != null)
24+
builder.AddContent(600, snippet.Trim());
25+
26+
builder.CloseElement(); // end: code
27+
builder.CloseElement(); // end: pre
28+
builder.CloseElement(); // end: div
29+
}
30+
31+
protected override async Task OnAfterRenderAsync(bool firstRender)
32+
{
33+
if (firstRender)
34+
await JS.InvokeVoidAsync("highlightCode");
35+
36+
await base.OnAfterRenderAsync(firstRender);
37+
}
38+
1339
protected override async Task OnParametersSetAsync()
1440
{
15-
if (code is null)
41+
if (snippet is null)
1642
{
17-
if (!string.IsNullOrWhiteSpace(File))
43+
if (!string.IsNullOrWhiteSpace(FilePath))
1844
{
19-
var resourceName = File.Replace("~", typeof(CodeSnippet).Assembly.GetName().Name).Replace("/", ".").Replace("\\", ".");
45+
var resourceName = FilePath.Replace("~", typeof(Snippet).Assembly.GetName().Name).Replace("/", ".").Replace("\\", ".");
2046

21-
using (var stream = typeof(CodeSnippet).Assembly.GetManifestResourceStream(resourceName)!)
47+
using (var stream = typeof(Snippet).Assembly.GetManifestResourceStream(resourceName)!)
2248
{
2349
try
2450
{
@@ -27,7 +53,7 @@ protected override async Task OnParametersSetAsync()
2753

2854
using (var reader = new StreamReader(stream))
2955
{
30-
code = await reader.ReadToEndAsync();
56+
snippet = await reader.ReadToEndAsync();
3157
}
3258
}
3359
catch (Exception ex)
@@ -39,62 +65,15 @@ protected override async Task OnParametersSetAsync()
3965
}
4066
}
4167

42-
private string? GetLanguageFromFileExtension()
43-
{
44-
if (string.IsNullOrWhiteSpace(File))
45-
return null;
46-
47-
return Path.GetExtension(File).ToLower() switch
48-
{
49-
".razor" => "cshtml",
50-
".cshtml" => "cshtml",
51-
".html" => "html",
52-
".css" => "css",
53-
".cs" => "csharp",
54-
".txt" => "none",
55-
".js" => "js",
56-
_ => null
57-
};
58-
}
59-
60-
protected override void BuildRenderTree(RenderTreeBuilder builder)
61-
{
62-
// no base call
63-
builder.AddMarkupContent(0, "<!--googleoff: index-->");
64-
65-
builder.OpenElement(300, "div");
66-
builder.AddAttribute(301, "class", "highlight show-code-only");
67-
builder.OpenElement(400, "pre");
68-
builder.OpenElement(401, "code");
69-
builder.AddAttribute(402, "class", $"language-{Language ?? GetLanguageFromFileExtension() ?? "cshtml"}");
70-
if (code != null)
71-
{
72-
builder.AddContent(403, code.Trim());
73-
}
74-
builder.CloseElement(); // end: code
75-
builder.CloseElement(); // end: pre
76-
builder.CloseElement();
77-
78-
builder.AddMarkupContent(700, "<!--googleon: index-->");
79-
}
80-
81-
protected override async Task OnAfterRenderAsync(bool firstRender)
82-
{
83-
if (firstRender)
84-
await JS.InvokeVoidAsync("highlightCode");
85-
86-
await base.OnAfterRenderAsync(firstRender);
87-
}
88-
8968
#endregion
9069

9170
#region Properties
9271

9372
[Inject] protected IJSRuntime JS { get; set; } = null!;
9473

95-
[Parameter] public string? Language { get; set; }
74+
[Parameter] public LanguageCode LanguageCode { get; set; } = LanguageCode.Razor;
9675

97-
[Parameter] public string? File { get; set; }
76+
[Parameter] public string? FilePath { get; set; }
9877

9978
#endregion
10079
}

0 commit comments

Comments
 (0)