click/hover to Expand or collapse subgraphs/par

[Simon Jackson]

Proposal

It would be very useful to expand or collapse SUBGRAPH sections of a flowchart diagram (or PAR sections of a sequence diagram).

Attributes including:

• CollapsedByDefault (on/off)
• Expand on hover (on/off)
• Expand on click (on/off)
• Expanded-Height (int)
• Expanded-Width (int)
• Expanded-Z-Index (int)
• Expanded-Zoom (int)
• Expanded-Opacity (int)
• Collapsed-Height (int)
• Collapsed-Weight (int)
• Collapsed-Z-Index (int)
• Collapsed-Zoom (int)
• Collapsed-Opacity (int)

Use Cases

Flow-charts showing complex sketches, auto-collapsing down to large subject areas. Click one subject area to expand, blowing up the diagram to reveal lots of sub-objects.. Diagrams become more of an user-driven navigation mechanism.

Sequence diagrams (such as the sequence of a conversation), can collapse 'conversation about X' into one parameter section. By clicking on the conversation about x - we can derrive clear and distinct two-way conversations, questions/answers...

Screenshots

No response

Syntax

Here is one I took off my blog...

If the send_mail() section was collapsable, the diagram would be nice and tidy. Those interested in understanding that section could click to expand the full SMTP transcript inside...

THIS COMPLEX THING:

sequenceDiagram
    box aliceblue Sender
        participant SendingMTA as Sending MTA
    end

    participant DNS as Public DNS

    box aliceblue Receiver
        participant ReceivingMTA as Receiving MTA
        actor RecipientMBX as Recipient's Mailbox
    end

    par check_mx()
        Note over SendingMTA,DNS: (1) DNS Resolution (MX)
        SendingMTA-->>DNS: Query for MX Record
        DNS-->>SendingMTA: Recipient's Mail Servers IPs
    end

    par send_mail()
        Note over SendingMTA, ReceivingMTA: (2) SMTP Handshake (ignoring STARTTLS)
        SendingMTA-->>ReceivingMTA: ehlo servername.senderdomain.com
        ReceivingMTA-->>SendingMTA: 250 servername.receivingdomain.com hello 1.2.3.4
        SendingMTA-->>ReceivingMTA: mail from: [e-mail]

        par check_host()
            Note over DNS,ReceivingMTA: (3) SPF Authorisation
            ReceivingMTA-->>DNS: Query for SPF Record
            DNS-->>ReceivingMTA: Returns Approved IPs
        end

        ReceivingMTA-->>SendingMTA: 250 2.1.0 Sender OK
        SendingMTA-->>ReceivingMTA: rcpt to: [e-mail]
        ReceivingMTA-->>SendingMTA: 250 2.1.5 Recipient OK
        SendingMTA-->>ReceivingMTA: data</strong>
        ReceivingMTA-->>SendingMTA: 354 Start mail input. End with a period (.)
        SendingMTA-->>ReceivingMTA: subject: Test email
        SendingMTA-->>ReceivingMTA: This is a plain-text email, finishing on the next line.
        SendingMTA-->>ReceivingMTA: .
        ReceivingMTA-->>SendingMTA: 250 2.6.0 Queued mail for delivery
        SendingMTA-->>ReceivingMTA: quit
        ReceivingMTA-->>SendingMTA: bye
    end

    par store_mail()
        Note over ReceivingMTA,RecipientMBX: (X) Email Delivered to Recipient's Mailbox
        ReceivingMTA->>RecipientMBX: Store Email
    end

COULD BE COLLAPSED INTO THIS:

sequenceDiagram
    box aliceblue Sender
        participant SendingMTA as Sending MTA
    end

    participant DNS as Public DNS

    box aliceblue Receiver
        participant ReceivingMTA as Receiving MTA
        actor RecipientMBX as Recipient's Mailbox
    end

    par check_mx()
        Note over SendingMTA,DNS: (1) DNS Resolution (MX)
    end

    par send_mail()
        Note over SendingMTA, ReceivingMTA: (2) SMTP Handshake (ignoring STARTTLS)
        par check_host()
            Note over DNS,ReceivingMTA: (3) SPF Authorisation
        end
    end

    par store_mail()
        Note over ReceivingMTA,RecipientMBX: (X) Email Delivered to Recipient's Mailbox
    end

Implementation

None