Added placeholder docs fro C4C diagram

mermaid-js · Jun 14, 2022 · 113efd1 · 113efd1
1 parent f159808
commit 113efd1
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 9 deletions.
diff --git a/docs/_sidebar.md b/docs/_sidebar.md
@@ -15,6 +15,7 @@
  - [Pie Chart](pie.md)
  - [Requirement Diagram](requirementDiagram.md)
  - [Gitgraph (Git) Diagram 🔥](gitgraph.md)
+ - [C4C Diagram (Context) Diagram 🦺⚠️](c4c.md)
  - [Other Examples](examples.md)
 
 - ⚙️ Deployment and Configuration

diff --git a/docs/c4c.md b/docs/c4c.md
@@ -0,0 +1,46 @@
+# C4C Diagrams
+
+**Edit this Page** [![N|Solid](img/GitHub-Mark-32px.png)](https://github.com/mermaid-js/mermaid/blob/develop/docs/gitgraph.md)
+> C4 Diagram: This is an experimental diagram for now. The syntax and properties can change in future releases. Proper documentation will be provided when the syntax is stable.
+
+
+
+Mermaid's c4 diagram sytax is compatible with plantUML. See example below:
+
+```mermaid-example
+ C4Context
+ title System Context diagram for Internet Banking System
+
+ Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
+ Person(customerB, "Banking Customer B")
+ Person_Ext(customerC, "Banking Customer C")
+ System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
+
+ Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")
+
+ Enterprise_Boundary(b1, "BankBoundary") {
+
+ SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
+
+ System_Boundary(b2, "BankBoundary2") {
+ System(SystemA, "Banking System A")
+ System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts.")
+ }
+
+ System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
+ SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")
+
+ Boundary(b3, "BankBoundary3", "boundary") {
+ SystemQueue(SystemF, "Banking System F Queue", "A system of the bank, with personal bank accounts.")
+ SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
+ }
+ }
+
+ BiRel(customerA, SystemAA, "Uses")
+ BiRel(SystemAA, SystemE, "Uses")
+ Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
+ Rel(SystemC, customerA, "Sends e-mails to")
+
+
+```
+
diff --git a/src/diagrams/c4/c4Db.js b/src/diagrams/c4/c4Db.js
@@ -2,6 +2,7 @@ import mermaidAPI from '../../mermaidAPI';
 import * as configApi from '../../config';
 import { log } from '../../logger';
 import { sanitizeText } from '../common/common';
+import { setAccTitle, getAccTitle, getAccDescription, setAccDescription } from '../../commonDb';
 
 let c4ShapeArray = [];
 let boundaryParseStack = [''];
@@ -443,15 +444,6 @@ export const setTitle = function (txt) {
  title = sanitizedText;
 };
 
-const setAccDescription = function (description_lex) {
- let sanitizedText = sanitizeText(description_lex, configApi.getConfig());
- description = sanitizedText;
-};
-
-const getAccDescription = function () {
- return description;
-};
-
 export default {
  addPersonOrSystem,
  addPersonOrSystemBoundary,
@@ -472,6 +464,8 @@ export default {
  getRels,
  getTitle,
  getC4Type,
+ setAccTitle,
+ getAccTitle,
  getAccDescription,
  setAccDescription,
  parseDirective,