PMM Workflow Designer: bug fixes, zoom, XSS hardening, and branching starter flow - #153
Open
thanatornpodgemini-collab wants to merge 2 commits into
Conversation
…r flow engine/flowy.js - Fix rearrangeMe using r_array.y instead of r_array[0].y (blocks misplaced after any rearrange operation) - Fix bottom-edge auto-scroll writing scrollLeft instead of scrollTop - Fix int/string type mismatch in snap() rearrange parent assignment - Replace innerHTML += in drawArrow with insertAdjacentHTML to avoid full DOM re-serialization and re-parse on every arrow draw - Add skipRearrange parameter to flowy.import() so callers supplying pre-positioned HTML can opt out of the post-import rearrangeMe() pass - Add flowy.destroy() to remove all document-level event listeners - Cache repeated blocks.filter() lookups in snap/checkOffset/rearrangeMe - Remove unused addEventListenerMulti, removeEventListenerMulti, and maxheight dead variables demo/main.js - Replace innerHTML string interpolation in hydrateBlock and buildStarterFlowImport with createElement + textContent (XSS fix) - Fix analytics auto-correct matching blocks by label instead of ID - Fix persist() not clearing localStorage when canvas is empty - Add 150ms debounce on properties form input to avoid per-keystroke full-DOM analytics recalculation - Catch blocks in restore() and import handler now log errors instead of swallowing them silently - Replace linear 14-step starter flow with a 21-node branching tree: trunk (launch lifecycle) + 4 ongoing operational branches (competitive intel, content calendar, win/loss review, sales enablement ops) - buildStarterFlowImport rewritten with recursive subtree-width centering layout engine (root x=600 y=160, +220px depth, 320px gap) - Pass skipRearrange=true from build-starter and restore() so flowy's rearrangeMe() does not override custom tree positions Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…flow Canvas zoom feature: - Add zoom controls pill (−, %, +, reset) floating bottom-right of canvas - Support Ctrl/Cmd+scroll wheel to zoom; range 25%–200%, step 25% - Add flowy.setZoom(level) and scaled(rect) helper to engine/flowy.js so all drag mouse coordinates and block getBoundingClientRect calls are divided by zoom level, keeping snap/attach math correct at any zoom - applyZoom() in main.js updates transform, disables buttons at limits, and calls flowy.setZoom() to keep coordinate systems in sync Fix demo/flowy.min.js not tracking engine changes: - demo/flowy.min.js was the original unmodified library; all engine/flowy.js fixes (rearrangeMe, scrollTop, drawArrow, skipRearrange, destroy, zoom) were invisible to the demo — replaced with the fixed engine build Branching workflow tree (21 nodes): - Replace linear 14-step starter with trunk + 4 ongoing operational branches: competitive intel loop (off research), content calendar (off launch assets), win/loss review (off post-launch), sales enablement ops (off GTM strategy) - buildStarterFlowImport rewritten with recursive subtree-width centering layout - flowy.import() gains skipRearrange param to preserve caller-supplied positions Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR ships a substantial upgrade to the Flowy demo — turning it into a fully featured PMM Agentic Workflow Designer with bug fixes, security hardening, a canvas zoom control, and a realistic branching starter flow.
What changed
Bug fixes (
engine/flowy.js)rearrangeMeposition bug —r_array.ywas read/written on a filter array[]instead ofr_array[0], silently producingNaNpositions after any rearrangescrollLeftinstead ofscrollTopwhen cursor hit the bottom edgesnap()type mismatch — parent assignment compared int to string withoutparseInt, could silently fail to find the blockSecurity (
demo/main.js)hydrateBlockandbuildStarterFlowImportreplaced innerHTML string interpolation withcreateElement+textContentdrawArrowinnerHTML+= — replaced withinsertAdjacentHTMLto avoid full DOM re-serialization on every arrow drawCanvas zoom feature (
engine/flowy.js,demo/main.js,demo/index.html,demo/styles.css)− % + ⊡pill at bottom-right of canvasflowy.setZoom(level)+scaled(rect)helper divides all mouse coordinates and drag-elementgetBoundingClientRectcalls by the zoom factor — drag-and-drop stays correct at any zoom levelcanvas_div.getBoundingClientRect()intentionally left unscaled (it's in screen space)flowy.import()improvementsskipRearrangeparameter — callers supplying pre-positioned HTML can opt out of the post-importrearrangeMe()pass that would otherwise overwrite custom positions21-node branching starter flow (
demo/main.js)buildStarterFlowImportrewritten with a recursive subtree-width centering layout engine (root at x=600 y=160, +220px per depth level, 320px sibling gap)Reliability
persist()now callslocalStorage.removeItem()on empty canvas instead of bailing silentlyrestore()and JSON importcatchblocks now log errors instead of swallowing themflowy.destroy()added to remove all document-level event listenersaddEventListenerMulti,removeEventListenerMulti, unusedmaxheightvarsTest plan
−button — full tree visible in viewport, label reads50%🤖 Generated with Claude Code