svg.draw.js icon indicating copy to clipboard operation
svg.draw.js copied to clipboard

Make compatible with svg.js 3 branch

Open JanMisker opened this issue 5 years ago • 17 comments

Using SVG.List instead of SVG.Set

JanMisker avatar Apr 13 '19 14:04 JanMisker

Thanks for your contribution! Its nice, that only such a little change is needed. However, its not only code changes which are required for the new version. Here is a list which we try to verify for every 3.0 ready plugin:

  • esm importable
  • no dependency to global SVG (so SVG is imported via esm)
  • no dist-files in the repo. Instead, they are uploaded to the release page and npm
  • a d.ts file to have typings
  • enforded standard style via linter with "our" rules

I know thats a bit overwhelming but have a look how it was done in e.g. svg.draggable.js. Especially the npm scripts are interesting in this regard.

Fuzzyma avatar Apr 13 '19 20:04 Fuzzyma

Sure makes sense, good to have the list. I'll have a look. I only saw svg.select.js and that is still 'old style' it seems, even though compatible with 3.0?

JanMisker avatar Apr 13 '19 22:04 JanMisker

How about this? I took inspiration for the package.json, rollup config and eslint config from svg.draggable.js.

Also I got rid of the draw.extend because I didn't really see how to implement it properly with esm, and I replaced it with a registerPlugin function exported from svg.draw.js.

JanMisker avatar Apr 13 '19 23:04 JanMisker

Albeit this PR makes draw usable with svg.js v3.x it is not really using the new features. Thats why I planned to rework the whole plugin. However, getting it served like that I think I will publish it and rework when I find some time in the future

Fuzzyma avatar Apr 15 '19 07:04 Fuzzyma

I just found out about the awesome svg.js tools a couple of days ago, so still figuring out how stuff exactly works. I suppose the release notes are best way to find out about differences and new features in v3.x ?

Are you asking me to make the changes or will you process them?

JanMisker avatar Apr 15 '19 07:04 JanMisker

Yes the changelog is a good point to start. You can also take a look at the advent calender with code examples we posted on twitter. Or you just head directly to the codepen collection: https://codepen.io/collection/XpwMLO/#

Yes, I would like to ask you to fix those 2 things I pointed out. That would be awesome!

Fuzzyma avatar Apr 15 '19 07:04 Fuzzyma

Did you see I made the changes? And just wondering: how are you thinking to re-implement the extension? I'm thinking there could be more integrating between the draw, select and resize extensions??

JanMisker avatar Apr 17 '19 18:04 JanMisker

Sorry, no didn't see it. I wanted to make it cleaner in general. I rewrote some parts of this plugin as part of other work and found that there are more elegant solutions as the current one.

Which integrations of the plug-ins do you have in mind? I tried to decouple them as good as I could when I wrote them.

Fuzzyma avatar Apr 17 '19 18:04 Fuzzyma

I really like the plugin structure that allows me to draw anything I can SVG.invent, for example things with paths. See here for an example (not 100% sure that gist works, I copied some code from a test). However it is not possible to use selectize on those inventions.

JanMisker avatar Apr 17 '19 19:04 JanMisker

I really like the plugin structure that allows me to draw anything I can SVG.invent

I wouldnt have thought that anyone would use that feature :D. In svg.js v3.x invent is unfortunately gone. But you can just use class inheritence instead ^^. Why does select not work? You just have to implement a size function for your invented shape, or am I wrong here?

Fuzzyma avatar Apr 18 '19 10:04 Fuzzyma

One more thing I just found :D. You put the dist folder into git ignore. Thats correct, but when you do that, you need to explicitely delete this folder from git before. Otherwise they just stay in the repo and thats not what we want :)

Fuzzyma avatar Apr 18 '19 15:04 Fuzzyma

Sooo why exactly this was never merged? :D

Fuzzyma avatar Feb 19 '20 23:02 Fuzzyma

any update on this?

Bernix01 avatar Jun 14 '20 20:06 Bernix01

Unfortunately not. No time at hand

Fuzzyma avatar Jun 15 '20 03:06 Fuzzyma

svg.js is great, but it seems this PR is well and truly stuck despite the best efforts of @JanMisker to keep things moving. This, unfortunately, cripples a bunch of useful functionality in svg.js v3+. Is there any alternative way to get svg.draw.js to work with svg.js v3 or do we need to use svg.js 2.x for now? Maybe it's worth releasing an alternative unofficially supported svg.draw.js if the maintainers don't have time to support the merge or do major refactors. I don't mean this in any negative way, btw - I'm incredibly grateful that these projects exist, but I do know life gets in the way sometimes. @JanMisker - are you using a private build of svg.draw.js?

mindok avatar Aug 01 '20 02:08 mindok

@mindok I'm currently using this fork based on @JanMisker great job. It's working, at least does with svg.js 3+ based on this other fork. The release cycle of svg.js was very slow so I used to work with master branch but it became more prone to break builds so I forked the current master version. Now it is 3 commits behind so I believe it shouldn't have any problem.

Bernix01 avatar Aug 02 '20 01:08 Bernix01

hey @mindok and @Bernix01, thanks for the kinds words ;) I use standard svg.js but modified plugins. I must admit that after I got things working for my project I also didn't spend much time to look back at this. I did make another plugin to also edit drawn shapes, but I didn't document it so never published it. I now made it publicly visible so you can at least look at it, I think it depends on my fork of svg.draw.js. https://github.com/JanMisker/svg.edit.js

JanMisker avatar Aug 03 '20 15:08 JanMisker