From c74e0ec656899f14e0ca6602bc215730d9a6096b Mon Sep 17 00:00:00 2001 From: Gavin Nishizawa Date: Fri, 31 Mar 2023 13:59:16 -0700 Subject: [PATCH 01/12] have watch mode parse svg message correctly --- d2cli/static/watch.js | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) diff --git a/d2cli/static/watch.js b/d2cli/static/watch.js index 156a2992d..71fa9436f 100644 --- a/d2cli/static/watch.js +++ b/d2cli/static/watch.js @@ -25,14 +25,9 @@ function init(reconnectDelay) { console.debug("watch websocket received data"); } if (msg.svg) { - // We could turn d2SVG into an actual SVG element and use outerHTML to fully replace it - // with the result from the renderer but unfortunately that overwrites the #d2-svg ID. - // Even if you add another line to set it afterwards. The parsing/interpretation of outerHTML must be async. - // - // There's no way around that short of parsing out the top level svg tag in the msg and - // setting innerHTML to only the actual svg innards. However then you also need to parse - // out the width, height and viewbox out of the top level SVG tag and update those manually. - d2SVG.innerHTML = msg.svg; + // we can't just set `d2SVG.innerHTML = msg.svg` need to parse this as xml not html + const parsedXML = new DOMParser().parseFromString(msg.svg, "text/xml"); + d2SVG.replaceChildren(parsedXML.documentElement); const svgEl = d2SVG.querySelector("#d2-svg"); // just use inner SVG in watch mode From f72e0ecbdd0e8147508c523a075e1dfc8f2fca8a Mon Sep 17 00:00:00 2001 From: Gavin Nishizawa Date: Fri, 31 Mar 2023 14:17:02 -0700 Subject: [PATCH 02/12] changelog --- ci/release/changelogs/next.md | 1 + 1 file changed, 1 insertion(+) diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md index a312ab5be..5651bfee0 100644 --- a/ci/release/changelogs/next.md +++ b/ci/release/changelogs/next.md @@ -7,3 +7,4 @@ #### Bugfixes ⛑️ - Fix a bug in ID parsing [#322](https://github.com/terrastruct/d2/issues/322) +- Fix a bug in watch mode parsing SVG [#1119](https://github.com/terrastruct/d2/issues/1119) From 3228ae4a0dffe2cf2cc49db6a4ad024a3722f96b Mon Sep 17 00:00:00 2001 From: Toyam Cox Date: Thu, 30 Mar 2023 12:48:02 -0400 Subject: [PATCH 03/12] fix builds on 32bit If you put the uint32 type at the top instead of later, 32 bit builds All credit @ahesford --- ci/release/changelogs/next.md | 1 + lib/font/font.go | 8 ++++---- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md index 5651bfee0..b043fe110 100644 --- a/ci/release/changelogs/next.md +++ b/ci/release/changelogs/next.md @@ -6,5 +6,6 @@ #### Bugfixes ⛑️ +- Fix a bug in 32bit builds [#1115](https://github.com/terrastruct/d2/issues/1115) - Fix a bug in ID parsing [#322](https://github.com/terrastruct/d2/issues/322) - Fix a bug in watch mode parsing SVG [#1119](https://github.com/terrastruct/d2/issues/1119) diff --git a/lib/font/font.go b/lib/font/font.go index 698319b20..1b84a5e19 100644 --- a/lib/font/font.go +++ b/lib/font/font.go @@ -49,8 +49,8 @@ var ( WOFF_ENTRY_OFFSET_CHECKSUM = 16 // magic - MAGIC_WOFF = 0x774f4646 - MAGIC_CHECKSUM_ADJUSTMENT = 0xb1b0afba + MAGIC_WOFF uint32 = 0x774f4646 + MAGIC_CHECKSUM_ADJUSTMENT uint32 = 0xb1b0afba // sizes SIZE_OF_WOFF_HEADER = 44 @@ -85,7 +85,7 @@ func Sfnt2Woff(fontBuf []byte) ([]byte, error) { numTables := binary.BigEndian.Uint16(fontBuf[4:]) woffHeader := make([]byte, SIZE_OF_WOFF_HEADER) - binary.BigEndian.PutUint32(woffHeader[WOFF_OFFSET_MAGIC:], uint32(MAGIC_WOFF)) + binary.BigEndian.PutUint32(woffHeader[WOFF_OFFSET_MAGIC:], MAGIC_WOFF) binary.BigEndian.PutUint16(woffHeader[WOFF_OFFSET_NUM_TABLES:], numTables) binary.BigEndian.PutUint16(woffHeader[WOFF_OFFSET_SFNT_SIZE:], 0) binary.BigEndian.PutUint32(woffHeader[WOFF_OFFSET_META_OFFSET:], 0) @@ -148,7 +148,7 @@ func Sfnt2Woff(fontBuf []byte) ([]byte, error) { csum += tableEntry.CheckSum } - var checksumAdjustment = uint32(MAGIC_CHECKSUM_ADJUSTMENT) - csum + var checksumAdjustment = MAGIC_CHECKSUM_ADJUSTMENT - csum majorVersion := uint16(0) minVersion := uint16(1) From 339bd6241fefc1ca5e6db392ac5c8cd370e56222 Mon Sep 17 00:00:00 2001 From: Alexander Wang Date: Sat, 1 Apr 2023 16:45:28 -0700 Subject: [PATCH 04/12] namespace transitions --- d2renderers/d2animate/d2animate.go | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/d2renderers/d2animate/d2animate.go b/d2renderers/d2animate/d2animate.go index b2f1b3074..7fca92dd7 100644 --- a/d2renderers/d2animate/d2animate.go +++ b/d2renderers/d2animate/d2animate.go @@ -14,23 +14,23 @@ import ( var transitionDurationMS = 1 -func makeKeyframe(delayMS, durationMS, totalMS, identifier int) string { +func makeKeyframe(delayMS, durationMS, totalMS, identifier int, diagramHash string) string { percentageBefore := (math.Max(0, float64(delayMS-transitionDurationMS)) / float64(totalMS)) * 100. percentageStart := (float64(delayMS) / float64(totalMS)) * 100. percentageEnd := (float64(delayMS+durationMS-transitionDurationMS) / float64(totalMS)) * 100. if int(math.Ceil(percentageEnd)) == 100 { - return fmt.Sprintf(`@keyframes d2Transition-%d { + return fmt.Sprintf(`@keyframes d2Transition-%s-%d { 0%%, %f%% { opacity: 0; } %f%%, %f%% { opacity: 1; } -}`, identifier, percentageBefore, percentageStart, math.Ceil(percentageEnd)) +}`, diagramHash, identifier, percentageBefore, percentageStart, math.Ceil(percentageEnd)) } percentageAfter := (float64(delayMS+durationMS) / float64(totalMS)) * 100. - return fmt.Sprintf(`@keyframes d2Transition-%d { + return fmt.Sprintf(`@keyframes d2Transition-%s-%d { 0%%, %f%% { opacity: 0; } @@ -40,7 +40,7 @@ func makeKeyframe(delayMS, durationMS, totalMS, identifier int) string { %f%%, 100%% { opacity: 0; } -}`, identifier, percentageBefore, percentageStart, percentageEnd, percentageAfter) +}`, diagramHash, identifier, percentageBefore, percentageStart, percentageEnd, percentageAfter) } func Wrap(rootDiagram *d2target.Diagram, svgs [][]byte, renderOpts d2svg.RenderOpts, intervalMS int) ([]byte, error) { @@ -99,13 +99,13 @@ func Wrap(rootDiagram *d2target.Diagram, svgs [][]byte, renderOpts d2svg.RenderO fmt.Fprint(buf, ``) for i, svg := range svgs { str := string(svg) - str = strings.Replace(str, " Date: Sat, 1 Apr 2023 16:46:28 -0700 Subject: [PATCH 05/12] changelog --- ci/release/changelogs/next.md | 1 + 1 file changed, 1 insertion(+) diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md index b043fe110..a5a68a05c 100644 --- a/ci/release/changelogs/next.md +++ b/ci/release/changelogs/next.md @@ -9,3 +9,4 @@ - Fix a bug in 32bit builds [#1115](https://github.com/terrastruct/d2/issues/1115) - Fix a bug in ID parsing [#322](https://github.com/terrastruct/d2/issues/322) - Fix a bug in watch mode parsing SVG [#1119](https://github.com/terrastruct/d2/issues/1119) +- Namespace transitions so that multiple animated D2 diagrams can exist on the same page [#1123](https://github.com/terrastruct/d2/issues/1123) From 94d61f7be9610da4ba8096606d306ecaf99e1393 Mon Sep 17 00:00:00 2001 From: Alexander Wang Date: Sat, 1 Apr 2023 20:19:12 -0700 Subject: [PATCH 06/12] regen --- .../testdata/TestCLI_E2E/animation.exp.svg | 16 ++++++++-------- .../TestCLI_E2E/internal_linked_pdf.exp.pdf | Bin 79806 -> 79806 bytes 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/e2etests-cli/testdata/TestCLI_E2E/animation.exp.svg b/e2etests-cli/testdata/TestCLI_E2E/animation.exp.svg index faaabdb28..c5a1b5b2c 100644 --- a/e2etests-cli/testdata/TestCLI_E2E/animation.exp.svg +++ b/e2etests-cli/testdata/TestCLI_E2E/animation.exp.svg @@ -838,7 +838,7 @@ .md .contains-task-list:dir(rtl) .task-list-item-checkbox { margin: 0 -1.6em 0.25em 0.2em; } -Chicken's plan +}]]>Chicken's plan -Approach roadChicken's plan +Approach roadChicken's plan -Approach roadCross roadChicken's plan +Approach roadCross roadChicken's plan -Approach roadCross roadMake you wonder whyChicken's plan +Approach roadCross roadMake you wonder whyChicken's plan \ No newline at end of file diff --git a/e2etests-cli/testdata/TestCLI_E2E/internal_linked_pdf.exp.pdf b/e2etests-cli/testdata/TestCLI_E2E/internal_linked_pdf.exp.pdf index 64ceca2ea4d3658c4e4cb54690b4af536e5b0cfc..463c4cc7a850319782fab64d0a0a7e65fab8a7a9 100644 GIT binary patch delta 70 zcmdn@o@L*AmWC~iUB=UQ8#5YA?=WUGoc`LF@v^FkfuWIsp}DD%CYQc%eu_(CNveW| TiZu?^s#@kE)Y_=9M delta 70 zcmdn@o@L*AmWC~iUB=V*7&Gcm?=WUGn*Q3D@v^G1v4N3+v4yFnCYQc%eu_(CNveW| TiZu?^s#@kE)Zr2t` From 9ac7a301b1aa31353c43daede7e2e65ceeb3898c Mon Sep 17 00:00:00 2001 From: segelt <86981324+segelt@users.noreply.github.com> Date: Sun, 2 Apr 2023 22:22:58 +0300 Subject: [PATCH 07/12] fixes #1104 --- d2renderers/d2svg/appendix/appendix.go | 2 +- .../testdata/diagram_wider_than_tooltip/sketch.exp.svg | 4 ++-- .../d2svg/appendix/testdata/internal-links/sketch.exp.svg | 2 +- d2renderers/d2svg/appendix/testdata/links/sketch.exp.svg | 6 +++--- .../d2svg/appendix/testdata/links_dark/sketch.exp.svg | 6 +++--- .../d2svg/appendix/testdata/tooltip_fill/sketch.exp.svg | 4 ++-- .../testdata/tooltip_wider_than_diagram/sketch.exp.svg | 4 ++-- 7 files changed, 14 insertions(+), 14 deletions(-) diff --git a/d2renderers/d2svg/appendix/appendix.go b/d2renderers/d2svg/appendix/appendix.go index a0eb21077..0f58ffa82 100644 --- a/d2renderers/d2svg/appendix/appendix.go +++ b/d2renderers/d2svg/appendix/appendix.go @@ -238,7 +238,7 @@ func generateLine(i, y int, text string, ruler *textmeasure.Ruler) (string, int, 0, y, generateNumberedIcon(i, 0, 0)) line += fmt.Sprintf(`%s`, - ICON_RADIUS*3, y, FONT_SIZE, d2svg.RenderText(text, ICON_RADIUS*3, float64(dims.Height))) + ICON_RADIUS*3, y+5, FONT_SIZE, d2svg.RenderText(text, ICON_RADIUS*3, float64(dims.Height))) return line, dims.Width + ICON_RADIUS*3, go2.IntMax(dims.Height, ICON_RADIUS*2) } diff --git a/d2renderers/d2svg/appendix/testdata/diagram_wider_than_tooltip/sketch.exp.svg b/d2renderers/d2svg/appendix/testdata/diagram_wider_than_tooltip/sketch.exp.svg index 615e8b5ff..2a624e820 100644 --- a/d2renderers/d2svg/appendix/testdata/diagram_wider_than_tooltip/sketch.exp.svg +++ b/d2renderers/d2svg/appendix/testdata/diagram_wider_than_tooltip/sketch.exp.svg @@ -115,8 +115,8 @@ -1Like starbucks or something -2I'm not sure what this is +1Like starbucks or something +2I'm not sure what this is x1 -1root > x +1root > x x1y2Gee, I feel kind of LIGHT in the head now, knowing I can't make my satellite dish PAYMENTS!3 -1https://d2lang.com -2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! -3https://terrastruct.com +1https://d2lang.com +2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! +3https://terrastruct.com x1y2Gee, I feel kind of LIGHT in the head now, knowing I can't make my satellite dish PAYMENTS!3 -1https://d2lang.com -2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! -3https://fosny.eu +1https://d2lang.com +2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! +3https://fosny.eu x1Total abstinence is easier than perfect moderationy2Gee, I feel kind of LIGHT in the head now, knowing I can't make my satellite dish PAYMENTS! -1Total abstinence is easier than perfect moderation -2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! +1Total abstinence is easier than perfect moderation +2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! x1Total abstinence is easier than perfect moderationy2Gee, I feel kind of LIGHT in the head now, knowing I can't make my satellite dish PAYMENTS! -1Total abstinence is easier than perfect moderation -2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS! +1Total abstinence is easier than perfect moderation +2Gee, I feel kind of LIGHT in the head now,knowing I can't make my satellite dish PAYMENTS!