Skip to content

Paragraphs and figures#240

Closed
jeffreyguenther wants to merge 3 commits intobasecamp:masterfrom
LoamStudios:paragraphs_and_figures
Closed

Paragraphs and figures#240
jeffreyguenther wants to merge 3 commits intobasecamp:masterfrom
LoamStudios:paragraphs_and_figures

Conversation

@jeffreyguenther
Copy link
Copy Markdown

@jeffreyguenther jeffreyguenther commented May 15, 2016

I'm opening this PR to start discussing what needs to be done to move attachments and their corresponding <figure> elements outside of the <p> when it's the default block (Addressed in #202). The attachment is represented as an AttachmentPiece and we need to treat it as a block.

One way we can do this by adding the block attribute attachment:

Trix.config.blockAttributes = attributes =
    attachment:
        tagName: "trix-attachment"

We could create a <trix-attachment> element and use it to represent the piece.

<trix-attachment>
    <span data-trix-selection="true" data-trix-cursor-target="true">&#65279</span>
    <figure class="attachment attachment-preview"><img>
             <figcaption class="caption"></figcaption>
            <progress class="progress" value="0" max="100" data-trix-mutable="true"></progress>
      </figure>
     <span data-trix-selection="true" data-trix-cursor-target="true">&#65279;</span
</trix-attachment>

Another option is to render the block without a root element, though I think this will require more modification in the renderer.

@javan, @sstephenson, which do you prefer?

@jeffreyguenther
Copy link
Copy Markdown
Author

jeffreyguenther commented May 15, 2016

Here are few more thoughts about rendering the block without a root element:

I think it keep generated HTML lean and semantic. A custom root element or div is not necessary to display the content, so in the name of terse, clean HTML, it should be avoided.

It will also provide a generic solution so other kinds of characters can be represented by sets of markup. An attachment is represented by an object replacement character. If you want to represent a page break, you can represent it with a form feed character. The page break can be used to mark where to do pagination on render and might be represented by a styled hr.

What is the best way to remove the root element? Does not having a root element affect selection and the cursor?

@javan
Copy link
Copy Markdown
Contributor

javan commented May 17, 2016

Instead of changing the behavior of attachment pieces, it might be easier and more desirable to allow configuring the html structure used to render attachments. That way people who switch from the default <div> block element to <p> (or any element that only permits phrasing content) can customize the attachment template to use non-block elements if they choose.

@jeffreyguenther
Copy link
Copy Markdown
Author

If an attachment is rendered in a phrase-content-only default block (<p>) as phrase content, I think we lose the ability to provide captions, and the supporting elements like remove buttons. Or we have to do something hacky to put them outside the <p>.

If people are allowed to choose the template, I think we should do it in a template engine agnostic way so people can use their favourite engine. A Trix.Operation seems like a good candidate.

I think it might even be worth allowing people to set the renderer for each block type. Then if an attachment is isolated to it's own block and the correct block attribute applied, Trix will know how to render it.

@mrigdon-zz
Copy link
Copy Markdown

@jeffreyguenther why was this closed?

@jeffreyguenther
Copy link
Copy Markdown
Author

It's been a long time since I did this work, but I believe it's because the work was out of scope of what the maintainers wanted/I didn't have the capacity to develop it further. My memory is a little fuzzy.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants