Skip to content

Commit

Permalink
Merge pull request #225 from tfsojon/chandu
Browse files Browse the repository at this point in the history
updated learning-center, blog and marmaid.js option
  • Loading branch information
devopstoday11 committed Aug 2, 2023
2 parents 899c33e + 48ea80e commit c2fbc34
Show file tree
Hide file tree
Showing 8 changed files with 193 additions and 139 deletions.
30 changes: 24 additions & 6 deletions content/english/mindmaps/devops/_index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: "DevOps"
date: 2023-07-10
weight: 1
# description
description: "Step by step guide on how to sign Git commits with a valid OpenID Connect identity"
description: "Step GOy step guide on how to sign Git commits with a valid OpenID Connect identity"
category: "Role based Mindmaps"
---

Expand Down Expand Up @@ -96,15 +96,33 @@ C4Deployment
```mermaid
zenuml
title Reply message
Client->A.method() {
B.method() {
Python->A.method() {
GO.method() {
if(condition) {
return x1
return Python
// return early
@return
A->Client: x11
A->Python: x11
}
}
return x2
return go
}
```

```mermaid
zenuml
BookLibService.Borrow(id) {
User = Python.GetUser()
if(User.isActive) {
try {
BookRepository.Update(id, onLoan, User)
receipt = new Receipt(id, dueDate)
} catch (BookNotFoundException) {
ErrorService.onException(BookNotFoundException)
} finally {
Connection.close()
}
}
return receipt
}
```
1 change: 1 addition & 0 deletions themes/delta/assets/js/script.js
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,7 @@ $(document).ready(function () {
let nextAncestor = menu.closest("li[data-nav-id]");
while (maxDepth-- >= 0 && nextAncestor !== null) {
nextAncestor.classList.add("parent");
nextAncestor.parentNode.style.display = "block";
let icon = nextAncestor.querySelector(".category-icon");
if (icon !== null) {
icon.classList.remove("icon-right");
Expand Down
8 changes: 7 additions & 1 deletion themes/delta/assets/scss/templates/_main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -1847,9 +1847,15 @@ footer {
pointer-events: none;
}
}
[data-roadmap] {
.clickable {
cursor: pointer;
user-select: none;
}
[data-mindmap] {
* {
@extend .clickable;
}
@extend .clickable;
[class^="node-line"],
.node-bkg {
transition: .3s;
Expand Down
12 changes: 4 additions & 8 deletions themes/delta/layouts/_default/single.html
Original file line number Diff line number Diff line change
Expand Up @@ -64,17 +64,11 @@ <h1 class="h2 mb-3">{{.Title | markdownify}}</h1>
</span>
</div>

<div class="content">
{{ if .Page.Store.Get "hasMermaid" }}<p class="content-loader text-center">loading..</p>{{end}}
<div class="content {{ if .Page.Store.Get `hasMermaid` }}content-hidden{{end}}">
{{.Content}}
</div>

{{ if .Page.Store.Get "hasMermaid" }}
<script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
mermaid.initialize({ startOnLoad: true });
</script>
{{ end }}

{{ with site.GetPage (string .Params.Author | urlize | lower) }}
{{if .Title}}
<div class="post-author d-flex border rounded-lg mt-5">
Expand Down Expand Up @@ -115,6 +109,8 @@ <h3 class="h5 title mb-1"><a href="{{.RelPermalink}}" class="text-dark">{{ .Titl
</div>
</section>

{{ partial "mermaid-script" . }}

{{ if site.Params.blog_popup.enable }}
{{ partial "popup-form" (dict "Class" "blog-popup" "Src" site.Params.blog_popup.clickup_iframe_url) }}
{{ end }}
Expand Down
118 changes: 3 additions & 115 deletions themes/delta/layouts/mindmaps/list.html
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,9 @@ <h2 class="h4 text-center mb-4 text-muted">{{ .Key }}</h2>

{{ else }}

<p class="content-loader text-center">loading..</p>
{{ if .Page.Store.Get "hasMermaid" }}<p class="content-loader text-center">loading..</p>{{end}}

<div class="content content-hidden">
<div class="content {{ if .Page.Store.Get `hasMermaid` }}content-hidden{{end}}">
{{ with site.GetPage "mindmaps" }}
{{ with .Params.all_mindmaps_button }}
<a href="{{.link | relLangURL}}" class="border rounded py-1 pe-2 ps-1 d-inline-flex align-item-center line-height-0">
Expand All @@ -81,119 +81,7 @@ <h2 class="mb-4 font-weight-medium mt-5">{{ .Title }}</h2>
{{.Content}}
</div>

{{ range .Data.Pages }}
<div
class="offcanvas offcanvas-end fade"
data-bs-scroll="true"
tabindex="-1"
id="{{.Title | urlize}}"
aria-labelledby="{{.Title | urlize}}"
style="width:500px; transform:none"
>
<div class="offcanvas-header">
<h4 class="offcanvas-title" id="offcanvasExampleLabel">{{.Title}}</h4>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<div class="content">
{{.Content}}
</div>
</div>
</div>
{{ end }}

{{ if .Page.Store.Get "hasMermaid" }}
<script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
mermaid.initialize({
startOnLoad: true,
securityLevel: 'loose',
theme: 'forest',
});

import zenuml from 'https://cdn.jsdelivr.net/npm/@mermaid-js/mermaid-zenuml@0.1.0/dist/mermaid-zenuml.esm.min.mjs';
await mermaid.registerExternalDiagrams([zenuml]);

function urlize(str) {
str = str.trim();
str = str.replace(/\s+/g, '-');
str = str.replace(/[^\w-]/g, '');
str = str.replace(/-{2,}/g, '-');
str = str.toLowerCase();
return str;
}

window.addEventListener('load', (event) => {
const body = document.querySelector('body');
const contentLoader = document.querySelector('.content-loader');
const content = document.querySelector('.content');
contentLoader.remove();
content.classList.remove('content-hidden');

let addDataAttribute = (el, textID) => {
el.setAttribute('type', 'button');
el.setAttribute('data-roadmap', '');
el.setAttribute('data-bs-toggle', 'offcanvas');
el.setAttribute('data-bs-target', '#'+urlize(textID));
el.setAttribute('aria-controls', urlize(textID));
}

setTimeout(function() {
// maindmap
let mindmapNode = document.querySelectorAll('.mindmap-node:not(.section-root):not(.node)');
mindmapNode.forEach(function(el) {
let innerText = el.querySelectorAll('.text-inner-tspan');
const textArray = [];
innerText.forEach((text) => {
textArray.push(text.textContent);
});
const textID = textArray.join(' ');
let id = document.getElementById(urlize(textID));
if (id) { addDataAttribute(el, textID) }
});

// flowchart
let flowchartLabel = document.querySelectorAll('.flowchart-label');
let flowchartEdgeLabel = document.querySelectorAll('g.edgeLabel');
let flowchartLabels = [...flowchartLabel, ...flowchartEdgeLabel];
flowchartLabels.forEach(function(el) {
let nodeLabel = el.querySelectorAll('.nodeLabel');
let edgeLabel = el.querySelectorAll('.edgeLabel');
let allLabel = [...nodeLabel, ...edgeLabel];
const textArray = [];
allLabel.forEach((text) => {
textArray.push(text.textContent);
});
const textID = textArray.join(' ');
let id = document.getElementById(urlize(textID));
if (id) { addDataAttribute(el, textID) }
});

// C4Context
let personMan = document.querySelectorAll('.person-man');
let personManLabel = document.querySelectorAll('g.edgeLabel');
personMan.forEach(function(el) {

const textArray = [];
let allLabel = el.querySelectorAll('text');
allLabel.forEach((text) => {
let fontSize = window.getComputedStyle(text).fontSize;
if (fontSize == '16px') {
textArray.push(text.textContent);
}
});

const textID = textArray.join(' ');
let id = document.querySelector(`[aria-labelledby="${urlize(textID)}"]`);
if (id) { addDataAttribute(el, textID) }
});


}, 1000);
});

</script>
{{ end }}
{{ partial "mermaid-script" . }}

{{ end }}
</div>
Expand Down
14 changes: 6 additions & 8 deletions themes/delta/layouts/partials/learning-center.html
Original file line number Diff line number Diff line change
Expand Up @@ -41,14 +41,9 @@ <h2 class="mb-4 font-weight-medium">{{ .Title }}</h2>
<span class="text-muted small d-inline-block mb-4" style="opacity:.75">Last Update : {{ .Lastmod.Format "02 January, 2006" }} <span class="mx-1 text-dark-50">|</span> Published : {{ .PublishDate.Format "02 January, 2006" }} <span class="mx-1 text-dark-50">|</span> {{.ReadingTime}} {{i18n `min_read`}}</span>

{{ if .Content }}
<div class="content" data-spy="scroll" data-target="#TableOfContents" data-offset="20">{{.Content}}</div>

{{ if .Page.Store.Get "hasMermaid" }}
<script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
mermaid.initialize({ startOnLoad: true });
</script>
{{ end }}

{{ if .Page.Store.Get "hasMermaid" }}<p class="content-loader text-center">loading..</p>{{end}}
<div class="content {{ if .Page.Store.Get `hasMermaid` }}content-hidden{{end}}" data-spy="scroll" data-target="#TableOfContents" data-offset="20">{{.Content}}</div>

{{ else }}
<ul class="list-styled text-left mb-4">
Expand All @@ -57,6 +52,7 @@ <h2 class="mb-4 font-weight-medium">{{ .Title }}</h2>
{{end}}
</ul>
{{ end }}

<nav class="pagination">
<!-- Next prev page -->
{{ $currentNode := . }}
Expand Down Expand Up @@ -104,6 +100,8 @@ <h2 class="mb-4 font-weight-medium">{{ .Title }}</h2>

</div>

{{ partial "mermaid-script" . }}

{{ if site.Params.learning_center_popup.enable }}
{{ partial "popup-form" (dict "Class" "learning-center-popup" "Src" site.Params.learning_center_popup.clickup_iframe_url) }}
{{ end }}
Expand Down
2 changes: 1 addition & 1 deletion themes/delta/layouts/partials/menu.html
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
{{ end }}

{{- if eq $currentSection $currentPageSection }}
<ul class="menu py-4 pe-2 pe-md-4 ps-0 pl-xl-4 mb-0">
<ul class="menu py-4 pe-2 pe-md-4 ps-0 pl-xl-4 mb-0" style="display:none;">

<button type="button" class="mb-2 bg-transparent border-0 p-0 mr-2 d-inline-block d-md-none" data-toggle="sidebar">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none">
Expand Down
Loading

0 comments on commit c2fbc34

Please sign in to comment.