alyssaxuu / flowy

The minimal javascript library to create flowcharts ✨
MIT License
11.47k stars 998 forks source link

Condition to check for existing snap #93

Closed Kannndev closed 4 years ago

Kannndev commented 4 years ago

Hi @alyssaxuu . Right now snapping method is not getting triggered when the existing blocks are moved. So I have modified the source to include a new method called onExistingSnap on the function (function(canvas, grab, release, snapping, rearrange, spacing_x, spacing_y, onExistingSnap)). This will add the block or put it to the previous state-based on the boolean returned;

I have added this condition in endDrag method:

`flowy.endDrag = function(event) { ...... else if (rearrange) { .... for (var i = 0; i < blocks.length; i++) { if (xpos >= blocks.filter(a => a.id == blocko[i])[0].x - (blocks.filter(a => a.id == blocko[i])[0].width / 2) - paddingx && xpos <= blocks.filter(a => a.id == blocko[i])[0].x + (blocks.filter(a => a.id == blocko[i])[0].width / 2) + paddingx && ypos >= blocks.filter(a => a.id == blocko[i])[0].y - (blocks.filter(a => a.id == blocko[i])[0].height / 2) && ypos <= blocks.filter(a => a.id == blocko[i])[0].y + blocks.filter(a => a.id == blocko[i])[0].height) { active = false; drag.classList.remove('dragging');

                        if (
                          onExistingSnap(
                            drag,
                            document.querySelector(
                              ".blockid[value='" + blocko[i] + "']"
                            ).parentNode
                          )
                        ) {
                          snap(drag, i, blocko);
                        } else {
                          snap(drag, blocko.indexOf(prevblock), blocko);
                        }
                        break;
                    } else if (i == blocks.length - 1) {
                        .....
                    }
                }
            }

...... }`

Please let me know your thoughts on this.

I will be happy to raise PR if this will work.

alyssaxuu commented 4 years ago

That's cool, this has also been brought up in #74. I'll keep in mind for my next release (which will be a complete revamp + new features), but won't be implementing it at the time. Closing as the code is going to be different for the next version of Flowy (I think it's too messy to work with right now anyway ^^)

hamzaGit19 commented 3 years ago

Hi @Kannndev , Thank you so much for this! It helped me days of hardwork.

And, @alyssaxuu great work on the library!

eriqsenyonga commented 5 months ago

@Kannndev thank you for this. Works perfectly