Attachments

[turt2live]

ref: https://api.slack.com/docs/message-attachments

The fallback should be treated as plain text (no formatting) and is used when the client (matrix) doesn't support the message.

Color / pretext

color: good, warning, danger, or any hex code like #439FE0

Slack renders this like:

we'll render it like this:

Attachments are otherwise rendered with a grey line. It's unfortunate that matrix doesn't support the line wrapping (pre-text) thing, but this will work for now.

This would be pretext<br>
<font color='#d9534f'>▌</font> danger is #d9534f<br>
<font color='#f0ad4e'>▌</font> warning is #f0ad4e<br>
<font color='#5cb85c'>▌</font> good is #5cb85c<br>
<font color='#439fe0'>▌</font> custom is #439fe0

Pretext is pretext

Use #f7f7f7 for default.

Authors

author_name, author_link, author_icon

<img src='mxc://t2bot.io/hcSELkhLCNMRxLLTXKffPPSn' width='16' height='16'> <a href='https://matrix.to/#/user/@voyager:t2bot.io'>Matrix Traveler</a>

Although the image may need cropping ahead of time.

Titles

title, title_link

Basically an h3 as an anchor

Fields

fields is an array of {title, value, short}. short is optional.

Images

image_url

thumb_url

Footers

footer and footer_icon (text & image). Treat much like the authors

ts (timestamp) - seconds since epoch

[joenas]

Hey. There's a veeeery crude implementation here. Feel free to have a look and you know.. provide some feedback.

Some notes (apart from code being a mess)

• Images aren't working because they need to be uploaded
• The sidebar looks ok in the synapse webclient but not much so in Riot Doneish
• Fields doesn't really behave like Slack, they ignore the short thingy Kinda done
• Maybe ditch the "bar" thing and use blockquote? Or just use the bar for title/pretext or something Done
• Maybe not use h3 for title because margins and whatnot Done
• Stuff like <https://honeybadger.io/path/to/event/|ReferenceError> from Slacks Honeybadger example isn't working but that would be fixed in Process slack links #14 I believe?

[joenas]

This is what it looks like in Riot atm

[turt2live]

The issue with using blockquotes would be that Riot strips all attempts at coloring it. Although that might be solved with a patch to Riot. I'll see if I can squeeze the patch in, but for now using blockquote should be fine.

[joenas]

That would be awesome! So ditch the bar thing?

Also I think I'll add a <br> after field title like in Slack. The table like formatting we'll have to live without tho

[turt2live]

Yea, ditch the bar thing and replace it with <blockquote style="border-color: #whatever;">...</blockquote>.

Technically Riot supports tables, they're just really ugly. A <br> is probably better.

[joenas]

Looks pretty decent?!

About the images, I guess I could use the util.uploadContentFromUrl somehow?

[turt2live]

Yea, it's just a promise thing. The avatar code should give a somewhat dirty example on how to use it.

[joenas]

I think I might drop the <h3> though.. h4 looks like bold on iOS and slightly larger on Riot desktop

[joenas]

Yea, it's just a promise thing. The avatar code should give a somewhat dirty example on how to use it.

Put it in its own layer, before slack_attachments? Is it possible for it to not resolve before the next layer starts doing its thing?
Also it needs bridge, which it guess we'd have to send as an argument to each layer?

[turt2live]

The layer can return a promise and it'll block on that.

[joenas]

Image uploading done! Anything else or should I create a PR and you can tear my JS-skillz apart? 😛
I opted to create a new class for the image uploading instead of a layer but injected in the layers.. kind of. It felt better to me but 🤷‍♂️

[joenas]

Maybe squash the commits?

[turt2live]

Opening a PR would probably be best so it's easier to see the changes.

[turt2live]

Added. Thanks @joenas !

[werkkrew]

Is supporting the "thumb_url" or "icon_url" slack message parameters in the plans? For example, I have a payload like this:

{
	"username":"PlexBot",
	"text":"Plex (Foo)\r\nAmerican Dharma was recently added to Plex.",
	"attachments":
	[{
		"title":"American Dharma (2019)",
		"text":"A portrait of controversial Breitbart honcho and Donald Trump advisor, Stephen K. Bannon.",
		"title_link":"https://www.imdb.com/title/tt8804284",
		"fields":
		[{
			"short":true,
			"value":"<https://www.imdb.com/title/tt8804284|IMDb>",
			"title":"View Details"
		}],
		"fallback":"Image for American Dharma (2019)",
		"thumb_url":"https://i.imgur.com/HzH2885.jpg"
	}],
	"icon_url":"https://i.imgur.com/iF8m9LE.png"
}