From 3c8bf69849b997fd763f797b963762431795dcbb Mon Sep 17 00:00:00 2001 From: yoonie-jang Date: Thu, 23 May 2024 16:38:49 -0400 Subject: [PATCH 1/5] Fix highlight issue and change hide implementation --- memory-viz/src/memory_model.ts | 18 +++++++++--------- memory-viz/src/style.ts | 7 +++++++ 2 files changed, 16 insertions(+), 9 deletions(-) diff --git a/memory-viz/src/memory_model.ts b/memory-viz/src/memory_model.ts index 9524f5cc..0d0b24e6 100644 --- a/memory-viz/src/memory_model.ts +++ b/memory-viz/src/memory_model.ts @@ -262,6 +262,15 @@ export class MemoryModel { this.getTextLength(type) + 10 ); + this.drawRect(x, y, id_box, this.prop_min_height, style.box_id); + this.drawRect( + x + width - type_box, + y, + type_box, + this.prop_min_height, + style.box_type + ); + this.drawText( id === null ? "" : `id${id}`, x + id_box / 2, @@ -275,15 +284,6 @@ export class MemoryModel { y + this.font_size * 1.5, style.text_type ); - - this.drawRect(x, y, id_box, this.prop_min_height, style.box_id); - this.drawRect( - x + width - type_box, - y, - type_box, - this.prop_min_height, - style.box_type - ); } /** diff --git a/memory-viz/src/style.ts b/memory-viz/src/style.ts index 407409dc..47568691 100644 --- a/memory-viz/src/style.ts +++ b/memory-viz/src/style.ts @@ -92,6 +92,7 @@ function populateStyleObject(object, seed) { // Constants employed to establish presets for styles. const HIGHLIGHT_TEXT = { "font-weight": "bolder", "font-size": "22px" }; const FADE_TEXT = { /*'font-weight': "normal",*/ "fill-opacity": 0.4 }; +const HIDE_TEXT = { "fill-opacity": 0 }; const HIGHLIGHT_BOX_LINES = { roughness: 0.2, strokeWidth: 4 }; const HIGHLIGHT_BOX = { roughness: 0.2, @@ -142,17 +143,23 @@ const presets = { box_type: FADE_BOX_LINES, }, hide: { + text_value: HIDE_TEXT, + text_id: HIDE_TEXT, + text_type: HIDE_TEXT, box_container: HIDE_BOX, box_id: HIDE_BOX, box_type: HIDE_BOX, }, hide_id: { + text_id: HIDE_TEXT, box_id: HIDE_BOX, }, hide_type: { + text_type: HIDE_TEXT, box_type: HIDE_BOX, }, hide_container: { + text_value: HIDE_TEXT, box_container: HIDE_BOX, }, }; From 9f0ca7dbab49e9dbc0643b2910bd8fb095e852dd Mon Sep 17 00:00:00 2001 From: yoonie-jang Date: Mon, 27 May 2024 13:54:12 -0400 Subject: [PATCH 2/5] update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 2ef23f92..b0ddc93c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -24,6 +24,7 @@ and adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). - Added data type and manual layout tests for the `draw` function. - Updated file paths for example files under docs to import the correct file. - Added style and automatic layout tests for the `draw` function. +- Fixed highlight bug and changed implementation of `hide` style option. ## [0.1.0] - 2024-04-16 From 5a6f6952f57949d06df713e0a4953412794136e8 Mon Sep 17 00:00:00 2001 From: yoonie-jang Date: Mon, 27 May 2024 13:58:22 -0400 Subject: [PATCH 3/5] update snapshots to reflect recent changes --- .../tests/__snapshots__/draw.spec.tsx.snap | 64 +++++++++---------- 1 file changed, 32 insertions(+), 32 deletions(-) diff --git a/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap b/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap index e1627135..7d7c2990 100644 --- a/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap +++ b/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap @@ -1,69 +1,69 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`draw function formats a mix of stack frame/non-stack frame objects in automatic layout 1`] = `"aid7__main__xid1yid17funcid170id81id84list"None"id10None"`; +exports[`draw function formats a mix of stack frame/non-stack frame objects in automatic layout 1`] = `"aid7__main__xid1yid17funcid170id81id84list"None"id10None"`; -exports[`draw function formats non-stack frame objects in automatic layout 1`] = `"42id98intnameid12id23fruitid19id42id22id63id54list"banana"id12str"`; +exports[`draw function formats non-stack frame objects in automatic layout 1`] = `"42id98intnameid12id23fruitid19id42id22id63id54list"banana"id12str"`; -exports[`draw function renders 'fade' style preset 1`] = `"itemid45__main__"fade!"id42str"`; +exports[`draw function renders 'fade' style preset 1`] = `"itemid45__main__"fade!"id42str"`; -exports[`draw function renders 'fade_id' style preset 1`] = `"itemid45__main__"fade id!"id42str"`; +exports[`draw function renders 'fade_id' style preset 1`] = `"itemid45__main__"fade id!"id42str"`; -exports[`draw function renders 'fade_type' style preset 1`] = `"itemid45__main__"fade_type!"id42str"`; +exports[`draw function renders 'fade_type' style preset 1`] = `"itemid45__main__"fade_type!"id42str"`; -exports[`draw function renders 'hide' style preset 1`] = `"itemid45__main__"hide!"id42str"`; +exports[`draw function renders 'hide' style preset 1`] = `"itemid45__main__"hide!"id42str"`; -exports[`draw function renders 'hide_container' style preset 1`] = `"itemid45__main__"hide container!"id42str"`; +exports[`draw function renders 'hide_container' style preset 1`] = `"itemid45__main__"hide container!"id42str"`; -exports[`draw function renders 'hide_id' style preset 1`] = `"itemid45__main__"hide id!"id42str"`; +exports[`draw function renders 'hide_id' style preset 1`] = `"itemid45__main__"hide id!"id42str"`; -exports[`draw function renders 'highlight' style preset 1`] = `"itemid45__main__"highlight!"id42str"`; +exports[`draw function renders 'highlight' style preset 1`] = `"itemid45__main__"highlight!"id42str"`; -exports[`draw function renders 'highlight_id' style preset 1`] = `"itemid45__main__"highlight id!"id42str"`; +exports[`draw function renders 'highlight_id' style preset 1`] = `"itemid45__main__"highlight id!"id42str"`; -exports[`draw function renders 'highlight_type' style preset 1`] = `"itemid45__main__"highlight type!"id42str"`; +exports[`draw function renders 'highlight_type' style preset 1`] = `"itemid45__main__"highlight type!"id42str"`; exports[`draw function renders a blank space 1`] = `""`; -exports[`draw function renders a bool 1`] = `"Trueid32bool"`; +exports[`draw function renders a bool 1`] = `"Trueid32bool"`; -exports[`draw function renders a bool using manual layout 1`] = `"Trueid32bool"`; +exports[`draw function renders a bool using manual layout 1`] = `"Trueid32bool"`; -exports[`draw function renders a dict 1`] = `"idxidyidz:id81:id100:id121id10dict"`; +exports[`draw function renders a dict 1`] = `"idxidyidz:id81:id100:id121id10dict"`; -exports[`draw function renders a float 1`] = `"7id32float"`; +exports[`draw function renders a float 1`] = `"7id32float"`; -exports[`draw function renders a list with indexes showing 1`] = `"id100id111id122id32list"`; +exports[`draw function renders a list with indexes showing 1`] = `"id100id111id122id32list"`; -exports[`draw function renders a list without indexes showing 1`] = `"id10id11id12id32list"`; +exports[`draw function renders a list without indexes showing 1`] = `"id10id11id12id32list"`; -exports[`draw function renders a set 1`] = `"id10id11,id12,id32set{}"`; +exports[`draw function renders a set 1`] = `"id10id11,id12,id32set{}"`; -exports[`draw function renders a stack frame and an int 1`] = `"my_intid13__main__7id13int"`; +exports[`draw function renders a stack frame and an int 1`] = `"my_intid13__main__7id13int"`; exports[`draw function renders a stack frame using manual layout 1`] = `"lst1id82lst2id84__main__"`; -exports[`draw function renders a str 1`] = `""winter"id32str"`; +exports[`draw function renders a str 1`] = `""winter"id32str"`; -exports[`draw function renders a tuple with indexes showing 1`] = `"id100id111id122id32tuple"`; +exports[`draw function renders a tuple with indexes showing 1`] = `"id100id111id122id32tuple"`; -exports[`draw function renders a tuple without indexes showing 1`] = `"id10id11id12id32tuple"`; +exports[`draw function renders a tuple without indexes showing 1`] = `"id10id11id12id32tuple"`; -exports[`draw function renders an empty dict 1`] = `"id32dict"`; +exports[`draw function renders an empty dict 1`] = `"id32dict"`; -exports[`draw function renders an empty list 1`] = `"id32list"`; +exports[`draw function renders an empty list 1`] = `"id32list"`; -exports[`draw function renders an empty set 1`] = `"id32set{}"`; +exports[`draw function renders an empty set 1`] = `"id32set{}"`; -exports[`draw function renders an empty tuple 1`] = `"id32tuple"`; +exports[`draw function renders an empty tuple 1`] = `"id32tuple"`; -exports[`draw function renders an int 1`] = `"7id32int"`; +exports[`draw function renders an int 1`] = `"7id32int"`; -exports[`draw function renders an object with no type and no value 1`] = `""None"id13None"`; +exports[`draw function renders an object with no type and no value 1`] = `""None"id13None"`; -exports[`draw function renders blank spaces in automatic layout 1`] = `"42id98int"life"id99str"`; +exports[`draw function renders blank spaces in automatic layout 1`] = `"42id98int"life"id99str"`; -exports[`draw function renders combinations of style presets 1`] = `"itemid45__main__"combination!"id42str"`; +exports[`draw function renders combinations of style presets 1`] = `"itemid45__main__"combination!"id42str"`; -exports[`draw function renders custom style (without presets) 1`] = `""David is cool!"id19str"`; +exports[`draw function renders custom style (without presets) 1`] = `""David is cool!"id19str"`; -exports[`draw function should produce consistent svg when provided seed 1`] = `"lst1id82lst2id84pid99did10tid11__main__"David is cool!"id19str7id13int"`; +exports[`draw function should produce consistent svg when provided seed 1`] = `"lst1id82lst2id84pid99did10tid11__main__"David is cool!"id19str7id13int"`; From efe3d47f84e603c54e618cfc7c7cf1300c2d7a90 Mon Sep 17 00:00:00 2001 From: yoonie-jang Date: Sat, 1 Jun 2024 22:29:26 -0400 Subject: [PATCH 4/5] fix changelog --- CHANGELOG.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b0ddc93c..e6c3ab3f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,8 @@ and adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). ### 🐛 Bug fixes +- Fixed a bug where box fill colours would cover box text, and changed the implementation of `hide` style option. + ### 📚 Documentation and demo website changes ### 🔧 Internal changes @@ -24,7 +26,8 @@ and adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). - Added data type and manual layout tests for the `draw` function. - Updated file paths for example files under docs to import the correct file. - Added style and automatic layout tests for the `draw` function. -- Fixed highlight bug and changed implementation of `hide` style option. +- Updated documentation, tests, and examples to reflect the `isClass` attribute being optional and set to `false` by default. +- Removed unused imports in `demo_C.js`. ## [0.1.0] - 2024-04-16 From 69dcc0b128bcc485cce6dfc2f30b9d24db5470c8 Mon Sep 17 00:00:00 2001 From: yoonie-jang Date: Tue, 4 Jun 2024 11:42:38 -0400 Subject: [PATCH 5/5] Fix order of draw functions and update snapshot tests --- memory-viz/src/memory_model.ts | 20 +++++++++---------- .../tests/__snapshots__/draw.spec.tsx.snap | 2 +- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/memory-viz/src/memory_model.ts b/memory-viz/src/memory_model.ts index 8d4446ca..8060909f 100644 --- a/memory-viz/src/memory_model.ts +++ b/memory-viz/src/memory_model.ts @@ -539,6 +539,9 @@ export class MemoryModel { box_height += 1.5 * this.item_min_height; } + this.drawRect(x, y, box_width, box_height, style.box_container); + const SIZE = { x, y, width: box_width, height: box_height }; + // A second loop, so that we can position the colon and value boxes correctly. curr_y = y + this.prop_min_height + this.item_min_height / 2; for (const k in obj) { @@ -549,13 +552,6 @@ export class MemoryModel { this.getTextLength(idv + 5) ); - this.drawText( - ":", - x + box_width / 2, - curr_y + this.item_min_height / 2 + this.font_size / 4, - { fill: this.text_color } - ); - // Draw the rectangle for values. this.drawRect( x + box_width / 2 + this.font_size, @@ -564,6 +560,13 @@ export class MemoryModel { this.item_min_height ); + this.drawText( + ":", + x + box_width / 2, + curr_y + this.item_min_height / 2 + this.font_size / 4, + { fill: this.text_color } + ); + this.drawText( idv, x + box_width / 2 + this.font_size + value_box / 2, @@ -574,9 +577,6 @@ export class MemoryModel { curr_y += this.item_min_height * 1.5; } - this.drawRect(x, y, box_width, box_height, style.box_container); - const SIZE = { x, y, width: box_width, height: box_height }; - this.drawProperties(id, "dict", x, y, box_width, style); return SIZE; diff --git a/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap b/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap index 7d7c2990..424bfbff 100644 --- a/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap +++ b/memory-viz/src/tests/__snapshots__/draw.spec.tsx.snap @@ -28,7 +28,7 @@ exports[`draw function renders a bool 1`] = `"Trueid32bool"`; -exports[`draw function renders a dict 1`] = `"idxidyidz:id81:id100:id121id10dict"`; +exports[`draw function renders a dict 1`] = `"idxidyidz:id81:id100:id121id10dict"`; exports[`draw function renders a float 1`] = `"7id32float"`;