Discuss Scratch

nXIII
Scratcher
1000+ posts

Collapsable Quotes

Quotes should be collapsable/expandable by clicking on a disclosure triangle. They should be collapsed by default if they are:
  • greater than 160 pixels in height; or
  • nested more than two levels, e.g., the innermost quote in
    [quote][quote][quote][/quote][/quote][/quote]
Quotes inside of collapsed quotes should not be collapsed, i.e., it should not take more than one click to expand and view an entire thread of quotes.

This will eliminate the need for a limit on quote nesting while still allowing users to view the full chain of replies in a discussion.
scimonster
Scratcher
1000+ posts

Collapsable Quotes

Let me guess, you're gonna do this?
nXIII
Scratcher
1000+ posts

Collapsable Quotes

I probably will if this ends up being accepted, but I posted this for feedback on the idea (issues, questions, clarifications, etc.).
Hardmath123
Scratcher
1000+ posts

Collapsable Quotes

Speaking of clarifications, will you be loading the entire quote train and hiding it with JavaScript, or AJAXing the contents when you click the disclosure triangle? Are you even using disclosure triangles, or are you going to make a subtle link that says (more)
nXIII
Scratcher
1000+ posts

Collapsable Quotes

Hardmath123
Speaking of clarifications, will you be loading the entire quote train and hiding it with JavaScript, or AJAXing the contents when you click the disclosure triangle?
I was intending to hide/show it with JS, but I suppose we could also store a reply field on each post and load it from there. That would be much less flexible, though.

Are you even using disclosure triangles, or are you going to make a subtle link that says (more)
The former, most likely; something like this:

> Lightnin …

\/ Lightnin
Total simulpost. Sweet.

Last edited by nXIII (Jan. 22, 2013 13:19:44)

scimonster
Scratcher
1000+ posts

Collapsable Quotes

Use DOM, not AJAX. And a disclosure triangle will be good.
Hardmath123
Scratcher
1000+ posts

Collapsable Quotes

I think you should be able to do it with CSS… using :before and :after pseudo-elements which area actually customized checkboxes. And a bit of magic.
nXIII
Scratcher
1000+ posts

Collapsable Quotes

Hardmath123
I think you should be able to do it with CSS… using :before and :after pseudo-elements which area actually customized checkboxes. And a bit of magic.
Nope. <details> is much more semantically correct (although we'd have to implement it with JS for browsers that don't support it). It's also impossible to find the rendered height of an element in CSS, which is part of my original suggestion.

Last edited by nXIII (Jan. 22, 2013 15:39:02)

Hardmath123
Scratcher
1000+ posts

Collapsable Quotes

How? That sounds pretty useful.

Also, your sig's a bit too small now.
nXIII
Scratcher
1000+ posts

Collapsable Quotes

Hardmath123
How? That sounds pretty useful.

Also, your sig's a bit too small now.
Yeah, well…I fixed all the fonts in the next update, so it won't be for long

<details> is a cool new(ish) element that's perfect for this. I think the JS polyfill would just use a data-collapsed attribute (to avoid conflicting with the real “open” attribute) and a CSS selector to show the content (that way, you won't have a rule that unconditionally hide the content and a data-open rule that shows it, which would totally fail if the user disabled javascript).

The actual script would just do document.querySelectorAll('.blockpost details.quote') (or some IE8-friendly alternative) and add remove the open attribute (and add a data-collapsed attribute) to the ones it wanted to collapse.
scimonster
Scratcher
1000+ posts

Collapsable Quotes

nXIII
Hardmath123
How? That sounds pretty useful.

Also, your sig's a bit too small now.
Yeah, well…I fixed all the fonts in the next update, so it won't be for long

<details> is a cool new(ish) element that's perfect for this. I think the JS polyfill would just use a data-collapsed attribute (to avoid conflicting with the real “open” attribute) and a CSS selector to show the content (that way, you won't have a rule that unconditionally hide the content and a data-open rule that shows it, which would totally fail if the user disabled javascript).

The actual script would just do document.querySelectorAll('.blockpost details.quote') (or some IE8-friendly alternative) and add remove the open attribute (and add a data-collapsed attribute) to the ones it wanted to collapse.
Use jQuery; it's cross browser.
nXIII
Scratcher
1000+ posts

Collapsable Quotes

scimonster
nXIII
Hardmath123
How? That sounds pretty useful.

Also, your sig's a bit too small now.
Yeah, well…I fixed all the fonts in the next update, so it won't be for long

<details> is a cool new(ish) element that's perfect for this. I think the JS polyfill would just use a data-collapsed attribute (to avoid conflicting with the real “open” attribute) and a CSS selector to show the content (that way, you won't have a rule that unconditionally hide the content and a data-open rule that shows it, which would totally fail if the user disabled javascript).

The actual script would just do document.querySelectorAll('.blockpost details.quote') (or some IE8-friendly alternative) and add remove the open attribute (and add a data-collapsed attribute) to the ones it wanted to collapse.
Use jQuery; it's cross browser.
"or some IE8-friendly alternative"
scimonster
Scratcher
1000+ posts

Collapsable Quotes

nXIII
scimonster
nXIII
Hardmath123
How? That sounds pretty useful.

Also, your sig's a bit too small now.
Yeah, well…I fixed all the fonts in the next update, so it won't be for long

<details> is a cool new(ish) element that's perfect for this. I think the JS polyfill would just use a data-collapsed attribute (to avoid conflicting with the real “open” attribute) and a CSS selector to show the content (that way, you won't have a rule that unconditionally hide the content and a data-open rule that shows it, which would totally fail if the user disabled javascript).

The actual script would just do document.querySelectorAll('.blockpost details.quote') (or some IE8-friendly alternative) and add remove the open attribute (and add a data-collapsed attribute) to the ones it wanted to collapse.
Use jQuery; it's cross browser.
"or some IE8-friendly alternative"
Yes. jQuery is an IE8-friendly alternative. I was giving a specific.
Lucario621
Scratcher
100+ posts

Collapsable Quotes

Bump!

I was going to post a topic about how visually-distracting it is to view long conversations of quote chains that I've seen on a few forum topics, but luckily I found this thread. I think it'd be a great idea to have collapsable quotes. If it's not available by Scratch 2.0 release, that's fine… but it would really help make discussions easier to read, and it would be more convenient than simply limiting the quote-chains to just 3 like the original Scratch forums.
bullelk12
Scratcher
100+ posts

Collapsable Quotes

nXIII wrote:

Quotes should be collapsable/expandable by clicking on a disclosure triangle. They should be collapsed by default if they are:
  • greater than 160 pixels in height; or
  • nested more than two levels, e.g., the innermost quote in
    [quote][quote][quote][/quote][/quote][/quote]
Quotes inside of collapsed quotes should not be collapsed, i.e., it should not take more than one click to expand and view an entire thread of quotes.

This will eliminate the need for a limit on quote nesting while still allowing users to view the full chain of replies in a discussion.

Yea, there are a host of good reasons for that
bobbysq
Scratcher
100+ posts

Collapsable Quotes

Go
for
it,
man.

Last edited by bobbysq (April 11, 2013 00:47:18)

lunaluvgood
Scratcher
100+ posts

Collapsable Quotes

BUMP!
and +1!
mythbusteranimator
Scratcher
1000+ posts

Collapsable Quotes

scimonster wrote:

nXIII wrote:

Hardmath123 wrote:

How? That sounds pretty useful.

Also, your sig's a bit too small now.
Yeah, well…I fixed all the fonts in the next update, so it won't be for long

<details> is a cool new(ish) element that's perfect for this. I think the JS polyfill would just use a data-collapsed attribute (to avoid conflicting with the real “open” attribute) and a CSS selector to show the content (that way, you won't have a rule that unconditionally hide the content and a data-open rule that shows it, which would totally fail if the user disabled javascript).

The actual script would just do document.querySelectorAll('.blockpost details.quote') (or some IE8-friendly alternative) and add remove the open attribute (and add a data-collapsed attribute) to the ones it wanted to collapse.
Use jQuery; it's cross browser.
Yeah, I would just use jQuery's “hide” and “show” elements. Every quote is a div, am I correct?

Powered by DjangoBB