Re: TinyMCE opening page with embedded SVG

Mark Barratt <[email protected]> Thu, 23 Apr 2015 11:38:36 +0100
Newsgroups gmane.comp.web.zope.plone.user
Message-ID <[email protected]>
Thanks for the pointer, Christian.

I have got around the problem in a different way but your product is useful in itself and as a learning tool.

Mark

> On 21 Apr 2015, at 08:36, Christian Ledermann <[email protected]> wrote:
> 
> in https://github.com/collective/collective.svgview I use embed which
> works pretty well
> 
> On 20 April 2015 at 15:19, Mark Barratt <[email protected]> wrote:
>> Thanks again Espen
>> 
>> That doesn’t work (maybe it did but doesn’t in Plone4.3 + TinyMCE 1.4.0).
>> 
>> I think at this point I’ll give up: native SVG would have been nice to have
>> in my XML exports for i18n purposes but we can work around it.
>> 
>> I am surprised though that SVG isn’t at least a standard Plone image type -
>> it’s not like it’s a new format. I’ll pursue that when I have some time.
>> 
>> Anyway, thanks very much for your suggestions.
>> 
>> Mark
>> 
>> On 20 Apr 2015, at 13:50, espen <[email protected]> wrote:
>> 
>> Hi again
>> 
>> 
>> 
>> 20. apr. 2015 kl. 13:25 skrev Mark Barratt [via Plone] <[hidden email]>:
>> 
>> Thanks, Espen, I did clear caches and generally got beyond that part.
>> TinyMCE now saves SVG properly. It now scrambles it on opening a page
>> instance to edit.
>> 
>> My problem is the last bit I reported:
>> 
>> 
>> I dont know too much about that, but I guess that it is more a TinyMCE
>> problem than a Plone problem.
>> I noticed that someone had a similar problem and …..
>> 
>> 
>> ----------------------
>> 
>> I did some debugging into TinyMCE and the problem seems to be that the svg
>> element is detected as being empty and therefor removed. Unfortunatley there
>> is no config way to change this behavior but there are some workarounds.
>> 
>> 1. Always have a name attibute for the svg element: <svg name="something"
>> 2. Always have a data-mce attribute for the svg element: <svg
>> data-mce-something="something"
>> 3. Include some text content within the svg element: <svg>&nbsp;</svg>
>> 
>> 
>> 
>> 
>> At this point I can paste a valid SVG element into the HTML view in TinyMCE,
>> update and see it rendered in the editor, then save the page and see it
>> rendered and scaled in the view.
>> 
>> However, if I then call ‘Edit’ then TinyMCE rewrites the SVG element to the
>> edit view with some markup rendered as literals and lots of ‘badref’
>> attributes with no value. So this (a fragment):
>> 
>> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
>> xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
>>         viewBox="0 0 164 165.2" enable-background="new 0 0 164 165.2"
>> xml:space="preserve" height="250" width="250">
>> <g>
>>        <rect y="108.9" fill="#4A4949" width="21" height="56.3"/>
>>        <rect x="7" y="151.9" fill="none" width="8.3" height="12"/>
>>        <text transform="matrix(1 0 0 1 7.0002 160.9924)" fill="#FFFFFF"
>> font-family="'OpenSans-CondensedBold'" font-size="12">1</text>
>>        <rect x="4.3" y="107.9" fill="none" width="11.3" height="38.3"/>
>> 
>>                <text transform="matrix(4.489659e-11 -1 1 4.489659e-11
>> 13.4533 146.2059)" fill="#FFFFFF" font-family="'OpenSans-CondensedBold'"
>> font-size="12">follow</text>
>>        <rect x="23.3" y="90.1" fill="#4A4949" width="21" height="75.1"/>
>>        <rect x="30.3" y="151.9" fill="none" width="8.3" height="12"/>
>>        <text transform="matrix(1 0 0 1 30.3335 160.9924)" fill="#FFFFFF"
>> font-family="'OpenSans-CondensedBold'" font-size="12">2</text>
>>        <rect x="27.7" y="107.9" fill="none" width="11.3" height="38.3"/>
>> 
>>                <text transform="matrix(4.489659e-11 -1 1 4.489659e-11
>> 36.7866 146.2059)" fill="#FFFFFF" font-family="'OpenSans-CondensedBold'"
>> font-size="12">assist</text>
>> 
>> becomes this sort of thing (a fragment:
>> 
>> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
>> xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewbox="0 0 164
>> 165.2" enable-background="new 0 0 164 165.2" xml:space="preserve"
>> height="250" width="250"> <g> <rect y="108.9" fill="&lt;span class="
>> badref=""></rect></g></svg><span class="badref"><span class="badref"><span
>> class="badref"><span class="badref"><span class="badref"><span
>> class="badref">#4</span></span></span></span></span></span>A4949" width="21"
>> height="56.3"&gt;
>> 
>> Anyone have any ideas on what is happening and how I can resolve it?
>> 
>> Many thanks
>> 
>> --
>> Mark Barratt
>> 
>> ------------------------------------------------------------------------------
>> BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
>> Develop your own process in accordance with the BPMN 2 standard
>> Learn Process modeling best practices with Bonita BPM through live exercises
>> http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
>> source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF
>> _______________________________________________
>> Plone-Users mailing list
>> <a href="<a href="<a
>> href="x-msg://25/user/SendEmail.jtp?type=node&amp;amp;amp;node=7573653&amp;amp;amp;i=0">x-msg://25/user/SendEmail.jtp?type=node&amp;amp;node=7573653&amp;amp;i=0"
>> class=""><a
>> href="x-msg://25/user/SendEmail.jtp?type=node&amp;amp;node=7573653&amp;amp;i=0">x-msg://25/user/SendEmail.jtp?type=node&amp;node=7573653&amp;i=0"
>> target="_top" rel="nofollow" link="external">[hidden email]
>> https://lists.sourceforge.net/lists/listinfo/plone-users
>> 
>> 
>> ________________________________
>> If you reply to this email, your message will be added to the discussion
>> below:
>> http://plone.293351.n2.nabble.com/TinyMCE-opening-page-with-embedded-SVG-tp7573653.html
>> To start a new topic under General Questions, email <a href="<a
>> href="x-msg://19/user/SendEmail.jtp?type=node&amp;amp;node=7573656&amp;amp;i=1">x-msg://19/user/SendEmail.jtp?type=node&amp;node=7573656&amp;i=1"
>> target="_top" rel="nofollow" link="external" class="">[hidden email]
>> To unsubscribe from Plone, click here.
>> NAML
>> 
>> 
>> 
>> ________________________________
>> View this message in context: Re: TinyMCE opening page with embedded SVG
>> Sent from the General Questions mailing list archive at Nabble.com.
>> ------------------------------------------------------------------------------
>> BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
>> Develop your own process in accordance with the BPMN 2 standard
>> Learn Process modeling best practices with Bonita BPM through live exercises
>> http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
>> source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF_______________________________________________
>> Plone-Users mailing list
>> <a href="x-msg://35/user/SendEmail.jtp?type=node&amp;node=7573658&amp;i=0"
>> target="_top" rel="nofollow" link="external">[hidden email]
>> https://lists.sourceforge.net/lists/listinfo/plone-users
>> 
>> 
>> --
>> Mark Barratt
>> Text Matters
>> 
>> We help explain things using design | language | systems | process
>> improvement
>> 
>> <a href="x-msg://35/user/SendEmail.jtp?type=node&amp;node=7573658&amp;i=1"
>> target="_top" rel="nofollow" link="external">[hidden email] | +44 (0)118 986
>> 8313
>> http://www.textmatters.com | Twitter @mark_barratt | Skype mark_barratt
>> 
>> 
>> 
>> 
>> ------------------------------------------------------------------------------
>> BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
>> Develop your own process in accordance with the BPMN 2 standard
>> Learn Process modeling best practices with Bonita BPM through live exercises
>> http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
>> source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF
>> _______________________________________________
>> Plone-Users mailing list
>> <a href="x-msg://35/user/SendEmail.jtp?type=node&amp;node=7573658&amp;i=2"
>> target="_top" rel="nofollow" link="external">[hidden email]
>> https://lists.sourceforge.net/lists/listinfo/plone-users
>> 
>> 
>> ________________________________
>> If you reply to this email, your message will be added to the discussion
>> below:
>> http://plone.293351.n2.nabble.com/TinyMCE-opening-page-with-embedded-SVG-tp7573653p7573658.html
>> To start a new topic under General Questions, email [hidden email]
>> To unsubscribe from Plone, click here.
>> NAML
>> 
>> 
>> 
>> ________________________________
>> View this message in context: Re: TinyMCE opening page with embedded SVG
>> Sent from the General Questions mailing list archive at Nabble.com.
>> ------------------------------------------------------------------------------
>> BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
>> Develop your own process in accordance with the BPMN 2 standard
>> Learn Process modeling best practices with Bonita BPM through live exercises
>> http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
>> source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF_______________________________________________
>> Plone-Users mailing list
>> [email protected]
>> https://lists.sourceforge.net/lists/listinfo/plone-users
>> 
>> 
>> 
>> 
>> ------------------------------------------------------------------------------
>> BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
>> Develop your own process in accordance with the BPMN 2 standard
>> Learn Process modeling best practices with Bonita BPM through live exercises
>> http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
>> source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF
>> _______________________________________________
>> Plone-Users mailing list
>> [email protected]
>> https://lists.sourceforge.net/lists/listinfo/plone-users
>> 
> 
> 
> 
> -- 
> Best Regards,
> 
> Christian Ledermann
> 
> London - UK
> Mobile : +44 7474997517
> 
> https://www.linkedin.com/in/christianledermann
> https://github.com/cleder/
> 
> 
> <*)))>{
> 
> If you save the living environment, the biodiversity that we have left,
> you will also automatically save the physical environment, too. But If
> you only save the physical environment, you will ultimately lose both.
> 
> 1) Don’t drive species to extinction
> 
> 2) Don’t destroy a habitat that species rely on.
> 
> 3) Don’t change the climate in ways that will result in the above.
> 
> }<(((*>



------------------------------------------------------------------------------
BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
Develop your own process in accordance with the BPMN 2 standard
Learn Process modeling best practices with Bonita BPM through live exercises
http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF
_______________________________________________
Plone-Users mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/plone-users