diff --git a/README.zh-CN.md b/README.zh-CN.md index 33212e3b5..63a3ee4aa 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -2,13 +2,13 @@ [English](./README.md) | 简体中文 -![banner](./img/header.png) + :trophy: **Mermaid 被提名并获得了 [JS Open Source Awards (2019)](https://osawards.com/javascript/2019) 的 "The most exciting use of technology" 奖项!!!** **感谢所有参与进来提交 PR，解答疑问的人们! 🙏** - +Explore Mermaid.js in depth, with real-world examples, tips & tricks from the creator... The first official book on Mermaid is available for purchase. Check it out! ## 关于 Mermaid @@ -23,7 +23,7 @@ Mermaid 通过允许用户创建便于修改的图表来解决这一难题，它 Mermaid 甚至能让非程序员也能通过 [Mermaid Live Editor](https://mermaid-js.github.io/mermaid-live-editor/) 轻松创建详细的图表。
你可以访问 [教程](./docs/Tutorials.md) 来查看 Live Editor 的视频教程，也可以查看 [Mermaid 的集成和使用](./docs/integrations.md) 这个清单来检查你的文档工具是否已经集成了 Mermaid 支持。 -如果想要查看关于 Mermaid 更详细的介绍及基础使用方式，可以查看 [入门指引](./docs/n00b-overview.md) and [用法](./docs/usage.md). +如果想要查看关于 Mermaid 更详细的介绍及基础使用方式，可以查看 [入门指引](./docs/n00b-overview.md), [用法](./docs/usage.md) 和 [教程](./docs/Tutorials.md). 🌐 [CDN](https://unpkg.com/mermaid/) | 📖 [文档](https://mermaidjs.github.io) | 🙌 [贡献](https://github.com/mermaid-js/mermaid/blob/develop/CONTRIBUTING.md) | 📜 [更新日志](./docs/CHANGELOG.md) @@ -35,7 +35,7 @@ __下面是一些可以使用 Mermaid 创建的图表示例。点击 [语法](ht -## 流程图 [文档 - live editor] +### 流程图 [文档 - live editor] ``` flowchart LR @@ -52,7 +52,7 @@ C -->|One| D[Result 1] C -->|Two| E[Result 2] ``` -## 时序图 [文档 - live editor] +### 时序图 [文档 - live editor] ``` sequenceDiagram @@ -77,7 +77,7 @@ John->>Bob: How about you? Bob-->>John: Jolly good! ``` -## 甘特图 [文档 - live editor] +### 甘特图 [文档 - live editor] ``` gantt @@ -100,7 +100,7 @@ gantt Parallel 4 : des6, after des4, 1d ``` -## 类图 [文档 - live editor] +### 类图 [文档 - live editor] ``` classDiagram @@ -139,7 +139,7 @@ class Class10 { } ``` -## 状态图 [文档 - live editor] +### 状态图 [[docs - live editor] ``` stateDiagram-v2 @@ -160,7 +160,7 @@ Moving --> Crash Crash --> [*] ``` -## 饼图 [文档 - live editor] +### 饼图 [文档 - live editor] ``` pie @@ -175,9 +175,9 @@ pie "Rats" : 15 ``` -## Git图 [实验特性 - live editor] +### Git图 [实验特性 - live editor] -## 用户体验旅程图 [文档 - live editor] +### 用户体验旅程图 [文档 - live editor] ``` journey @@ -202,7 +202,7 @@ pie Sit down: 3: Me ``` -### 发布 +## 发布 对于有权限的同学来说，你可以通过以下步骤来完成发布操作： diff --git a/src/diagrams/git/gitGraphAst.js b/src/diagrams/git/gitGraphAst.js index 1beb1a89e..84f27de0e 100644 --- a/src/diagrams/git/gitGraphAst.js +++ b/src/diagrams/git/gitGraphAst.js @@ -8,6 +8,8 @@ import common from '../common/common'; let mainBranchName = getConfig().gitGraph.mainBranchName; let commits = {}; let head = null; +let branchesConfig = {}; +branchesConfig[mainBranchName] = { name: mainBranchName, order: 0 }; let branches = {}; branches[mainBranchName] = head; let curBranch = mainBranchName; @@ -113,10 +115,11 @@ export const commit = function (msg, id, type, tag) { log.debug('in pushCommit ' + commit.id); }; -export const branch = function (name) { +export const branch = function (name, order) { name = common.sanitizeText(name, configApi.getConfig()); if (typeof branches[name] === 'undefined') { branches[name] = head != null ? head.id : null; + branchesConfig[name] = { name, order: order ? parseInt(order, 10) : null }; checkout(name); log.debug('in createBranch'); } else { @@ -324,17 +327,25 @@ export const clear = function () { let mainBranch = getConfig().gitGraph.mainBranchName; branches = {}; branches[mainBranch] = null; + branchesConfig = {}; + branchesConfig[mainBranch] = { name: mainBranch, order: 0 }; curBranch = mainBranch; seq = 0; }; export const getBranchesAsObjArray = function () { - const branchArr = []; - for (let branch in branches) { - // branchArr.push({ name: branch, commit: commits[branches[branch]] }); - branchArr.push({ name: branch }); - } - return branchArr; + const branchesArray = Object.values(branchesConfig) + .map((branchConfig, i) => { + if (branchConfig.order !== null) return branchConfig; + return { + ...branchConfig, + order: parseFloat(`0.${i}`, 10), + }; + }) + .sort((a, b) => a.order - b.order) + .map(({ name }) => ({ name })); + + return branchesArray; }; export const getBranches = function () { diff --git a/src/diagrams/git/gitGraphParserV2.spec.js b/src/diagrams/git/gitGraphParserV2.spec.js index 670c3a371..978528a7e 100644 --- a/src/diagrams/git/gitGraphParserV2.spec.js +++ b/src/diagrams/git/gitGraphParserV2.spec.js @@ -364,6 +364,46 @@ describe('when parsing a gitGraph', function () { expect(parser.yy.getDirection()).toBe('LR'); expect(Object.keys(parser.yy.getBranches()).length).toBe(2); }); + it('should handle new branch checkout with order', function () { + const str = `gitGraph: + commit + branch test1 order: 3 + branch test2 order: 2 + branch test3 order: 1 + `; + + parser.parse(str); + const commits = parser.yy.getCommits(); + expect(Object.keys(commits).length).toBe(1); + expect(parser.yy.getCurrentBranch()).toBe('test3'); + expect(Object.keys(parser.yy.getBranches()).length).toBe(4); + expect(parser.yy.getBranchesAsObjArray()).toStrictEqual([ + { name: 'main' }, + { name: 'test3' }, + { name: 'test2' }, + { name: 'test1' }, + ]); + }); + it('should handle new branch checkout with and without order', function () { + const str = `gitGraph: + commit + branch test1 order: 1 + branch test2 + branch test3 + `; + + parser.parse(str); + const commits = parser.yy.getCommits(); + expect(Object.keys(commits).length).toBe(1); + expect(parser.yy.getCurrentBranch()).toBe('test3'); + expect(Object.keys(parser.yy.getBranches()).length).toBe(4); + expect(parser.yy.getBranchesAsObjArray()).toStrictEqual([ + { name: 'main' }, + { name: 'test2' }, + { name: 'test3' }, + { name: 'test1' }, + ]); + }); it('should handle new branch checkout & commit', function () { const str = `gitGraph: diff --git a/src/diagrams/git/parser/gitGraph.jison b/src/diagrams/git/parser/gitGraph.jison index 7c1105144..4ac2a603f 100644 --- a/src/diagrams/git/parser/gitGraph.jison +++ b/src/diagrams/git/parser/gitGraph.jison @@ -36,6 +36,7 @@ "HIGHLIGHT" return 'HIGHLIGHT'; "tag:" return 'COMMIT_TAG'; "branch" return 'BRANCH'; +"order:" return 'ORDER'; "merge" return 'MERGE'; // "reset" return 'RESET'; "checkout" return 'CHECKOUT'; @@ -49,6 +50,7 @@ ["] this.begin("string"); ["] this.popState(); [^"]* return 'STR'; +[0-9]+ return 'NUM'; [a-zA-Z][-_\./a-zA-Z0-9]*[-_a-zA-Z0-9] return 'ID'; <> return 'EOF'; @@ -90,10 +92,14 @@ line statement : commitStatement | mergeStatement - | BRANCH ID {yy.branch($2)} + | branchStatement | CHECKOUT ID {yy.checkout($2)} // | RESET reset_arg {yy.reset($2)} ; +branchStatement + : BRANCH ID {yy.branch($2)} + | BRANCH ID ORDER NUM {yy.branch($2, $4)} + ; mergeStatement : MERGE ID {yy.merge($2)}