Make WordPress Core

Changes between Initial Version and Version 1 of Ticket #18311, comment 29

05/01/12 01:14:08 (2 years ago)


  • Ticket #18311, comment 29

    initial v1  
    11Replying to [comment:28 jeremyclarke]: 
    2 >  
    3 >  
    4 > Replying to [comment:26 sushkov]: 
    5 > > Added a diff that makes current editor allowing HTML. Though I still have to add some filtering on what HTML is allowed to be inserted. 
    6 > > File is not minimized! 
    7 >  
    8 > Just tried this and it is a good partial solution! It does make links work if inserted with the media uploader, and gives a advanced-code-based solution for adding/editing links in captions from the visual and HTML editors.  
    9 >  
    10 > Is there something unusual about this patch though? I tried {{{patch -p0 FILENAME.diff}}} and it totally didn't work. I just went in and aplied them by hand.  
    11 >  
    12 > Anyone trying this patch should remember to set the [http://codex.wordpress.org/Debugging_in_WordPress#SCRIPT_DEBUG script debug constants] so your install uses the dev JS files which are modified by the patch: 
    13 >  
    14 > Here's a rundown of things I tried and the results: 
    15 >  
    16 > * '''Insert caption w/ link into post with uploader''': works naturally. Links can be added with single or double quotes. Re-opening the media library and editing the link then re-inserting also works perfectly and is simple. 
    17 > * '''Switch back and forth between Visual and HTML''': works, doesn't break the results of insert. 
    18 > * '''Visible in TinyMCE''': Yes but confusing. Shows HTML code in caption box because the < and > tags are actually &lt;, &gt;, so the tags look like raw HTML when displayed. (see screenshot below) 
    19 > * '''Edit caption+link directly in TinyMCE''': Works but awkward because you have to write HTML in the Visual editor. If you just type in < and > then they get saved as &lt; which then gets the same treatment as links inserted by the media uploader. 
    20 > * '''Edit caption+link in "edit image" popup of TinyMCE''': Works partially - link can be edited but "caption" field is populated with the entity-encoded version of the caption, which normal users and even HTML-aware-but-not-expert users will find very confusing to work with. (see screenshot below) 
    21 > * '''Editable in HTML editor''': works but awkward - same problem as in Edit Image popup with entity-encoded HTML instead of ", ', < and >. Makes it very hard to edit. Obviously things like &gt; are more reasonable in this context than TinyMCE. 
    22 > * '''Link works when viewing post/gallery''': yes, looks right and behaves as expected. 
    23 >  
    24 >  
    25 > Personally I would be satisfied with the compromise that in HTML editor links-in-captions show up entity-encoded with &gt;, &39; etc. in their raw form. People using the HTML editor who really know HTML will understand what's happening and other types of users can be taught to simply delete and re-insert captions using the media uploader if they get something wrong. It even has decent WRITE-ability given that you can copy/paste from one caption into another to create links in captions by hand, and maybe some freaks will enjoy typing out &39;'s themselves. 
    26 >  
    27 > So the main thing this patch lacks is elegance when used inside the Visual editor. Having the links show up in the preview as raw HTML is probably not acceptable, and having them show up as HTML-encoded in the 'Edit Image' popup is definitely not acceptable.  
    28 >  
    29 >  
    30 > '''Making caption-HTML show up as HTML in the Edit Image popup''' 
    31 >  
    32 > Screenshot of the caption field from the Edit Image popup inside the Visual Editor: 
    33 >  
    34 > [[Image(http://simianuprising.com/wp-content/uploads/2012/02/tinyMCE-link-in-caption-editimage-screenshot.png)]] 
    35 >  
    36 > This strikes me as the easier problem. We need to filter the existing caption to entity-decode it as much as possible before sending it to the popup, and upon saving the popup we need to run the same encoding procedure used when inserting an image from the uploader popup. I took at stab at doing this and ended up on {{{editimage.dev.js}}} but I just can't figure out what does what. 
    37 >  
    38 > It seems that when the Edit Image popup loads, it already has something to convert &39; to ' and &quot; to " because those show up normally. The problem in the popup is the &lt; and &gt; so wherever the quote un-encoding happens hopefully it won't be too hard to account for those as well.  
    39 >  
    40 > Sushkov or Azaozz, do you know where this happens? What do you think is the best solution? 
    41 >  
    42 > '''Showing HTML in captions properly in the WYSIYWG preview''' 
    43 >  
    44 > This is a lot harder, and I don't even know where to start. Here's how it looks now: 
    45 >  
    46 > [[Image(http://simianuprising.com/wp-content/uploads/2012/02/tinyMCE-link-in-caption-screenshot1.png)]] 
    47 >  
    48 > This is very logical behavior because the WYSIWYG is just showing us what the HTML would look like when viewed on a post. The thing is that when we actually show it on a post, the caption content will be run through the {{{html_entity_decode()}}} first, making the link active instead of encoded, so ideally we should incorporate that logic into the behavior of the editor, just like the shortcode is already parsed out to have the grey box. 
    49 >  
    50 > What we need is to get TinyMCE, in whatever place it stores it's impression of the markup, to use a {{{html_entity_decode()}}}-style version of the caption text rather than the encoded version that is actually saved. Anyone have any idea how to make that happen? Is this likely to even be possible? 
    51 >  
    52 > One move that might simplify the problem would be to completely lock editing of the caption in the WYSIWYG, and force people to use the Edit Image popup to do so. It would be annoying in some cases but it would also be clear and simple and probably not a huge pain most of the time. Really captions are very complicated and even without links, editing them inline causes weird results (what happened when I tried to delete a caption+image by starting with the caption was not at all what I expected). Again I have no idea what would be involved in taking this route, so anyone who knows please speak up.  
    53 >  
    54 > Worst case scenario I'd accept if the answer is just "it looks wierd in the Visual editor if you have links in captions". It's still better than being unable to create links at all. 
    55 >  
    56 > '''Thanks for reading, it will be great to have this issue resolved'''  
    57 >  
    58 > Sushkov, please let me know if you think I got something wrong about your patch and what it does.  
    59 >  
    60 > Others, please test it too! 
    623Sorry for patch, my mistake. Should be fixed now.