BookStackApp
DrawIO vector can no longer be copied to another page! It will be an IMAGE!!
Describe the Bug
When you copy a DrawIO image to another page. Previously you could edit this again and adjust it slightly. This modified DrawIO drawing was then automatically given a new DrawIO diagram number and the underwater image was given a new name by the online DrawIO online editing tool. SUPER CONVENIENT!
Steps to Reproduce
When you copy a DrawIO image like.
<div drawio-diagram="657"><img src="https://localhost:8000/uploads/images/drawio/2024-03/EaYKku3XWqw8Zceo-drawing-1-1710508456.png" alt=""/></div>
It results in
<p id="bkmrk-"><a href="https://localhost:8000/uploads/images/gallery/2024-03/BCvbqhsyVFb1H6yb-image.png" target="_blank" rel="noopener"><img src="https://localhost:8000/uploads/images/gallery/2024-03/scaled-1680-/BCvbqhsyVFb1H6yb-image.png" alt="image.png"></a></p>
or
<p id="bkmrk--2"><img src="https://localhost:8000/uploads/images/drawio/2024-03/EaYKku3XWqw8Zceo-drawing-1-1710508456.png" alt=""></p>
Expected Behaviour
The HTML code must be exactly the same on the target page.
<div drawio-diagram="657"><img src="https://localhost:8000/uploads/images/drawio/2024-03/EaYKku3XWqw8Zceo-drawing-1-1710508456.png" alt=""/></div>
The magic is that after changes, drawIO saves a new vector image based on the old one in combination with bookstack. VERY HANDY!
Screenshots or Additional Context
No response
Browser Details
Chrome, Safari
Exact BookStack Version
I think this no longer works from v22 :(
Hi @steenks, I'm not totally sure what the issue reported here is, and what version you're referring to where it's not working.
I'm guessing you are attempting to copy a drawing as image data, then re-edit that, which won't work (and hasn't before as far as I know) since BookStack won't recognize it as a drawing by that point, but a standard image. You might hack better luck copying a range of content from the other page, including the drawing, then pasting that since that should copy the underlying image reference.
Alternatively, existing drawings can be re-inserted into other pages using the drawing manager, accessed via the dropdown on the drawing button, as mentioned our docs: https://www.bookstackapp.com/docs/user/diagrams/#wysiwyg-editor
Another option is to start a new drawing in the other page, then copy and paste the image itself into the (draw.io/diagrams.net) drawing editor rather than the BookStack page, since it should be imported as a drawing at that stage.
Hello Dan,
You should give it a try.
Create a DrawIO drawing and go to the Markdown editor. Just copy the div with DrawIO image (see example below)
Return to the WYSIWYG Editor. double click on the image, make a small adjustment in the drawing and click save and then the magic happens 😊. This certainly worked in an old version, but I don't remember which one ☹
Greetz, Johan
Van: Dan Brown @.> Datum: vrijdag, 15 maart 2024 om 15:04 Aan: BookStackApp/BookStack @.> CC: Johan Steenks @.>, Mention @.> Onderwerp: Re: [BookStackApp/BookStack] DrawIO vector can no longer be copied to another page! It will be an IMAGE!! (Issue #4901)
Hi @steenkshttps://github.com/steenks, I'm not totally sure what the issue reported here is, and what version you're referring to where it's not working.
I'm guessing you are attempting to copy a drawing as image data, then re-edit that, which won't work (and hasn't before as far as I know) since BookStack won't recognize it as a drawing by that point, but a standard image. You might hack better luck copying a range of content from the other page, including the drawing, then pasting that since that should copy the underlying image reference.
Alternatively, existing drawings can be re-inserted into other pages using the drawing manager, accessed via the dropdown on the drawing button, as mentioned our docs: https://www.bookstackapp.com/docs/user/diagrams/#wysiwyg-editor
Another option is to start a new drawing in the other page, then copy and paste the image itself into the (draw.io/diagrams.net) drawing editor rather than the BookStack page, since it should be imported as a drawing at that stage.
— Reply to this email directly, view it on GitHubhttps://github.com/BookStackApp/BookStack/issues/4901#issuecomment-1999740517, or unsubscribehttps://github.com/notifications/unsubscribe-auth/A6ANYFYLWKT7T5MNRMT6BG3YYL5XLAVCNFSM6AAAAABEYBFTQSVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSOJZG42DANJRG4. You are receiving this because you were mentioned.Message ID: @.***>