From eff2b3bb46323473c51aab1196fa2796c54344ab Mon Sep 17 00:00:00 2001 From: Jeremy Zhang Date: Sun, 5 Nov 2017 05:59:06 +0000 Subject: [PATCH] Display rich embed support --- discordbot/titanembeds/database/__init__.py | 4 +- discordbot/titanembeds/database/messages.py | 4 +- .../titanembeds/socketio/socketiointerface.py | 1 + ...6484faaccd_add_embed_column_to_messages.py | 28 ++++++ webapp/titanembeds/database/messages.py | 10 ++- webapp/titanembeds/static/css/embedstyle.css | 87 ++++++++++++++++++- webapp/titanembeds/static/js/embed.js | 37 +++++++- webapp/titanembeds/templates/embed.html.j2 | 77 +++++++++++++++- 8 files changed, 240 insertions(+), 8 deletions(-) create mode 100644 webapp/alembic/versions/7d6484faaccd_add_embed_column_to_messages.py diff --git a/discordbot/titanembeds/database/__init__.py b/discordbot/titanembeds/database/__init__.py index aa30e16..82c77ab 100644 --- a/discordbot/titanembeds/database/__init__.py +++ b/discordbot/titanembeds/database/__init__.py @@ -62,7 +62,8 @@ class DatabaseInterface(object): str(message.timestamp), edit_ts, json.dumps(get_message_mentions(message.mentions)), - json.dumps(message.attachments) + json.dumps(message.attachments), + json.dumps(message.embeds) ) session.add(msg) session.commit() @@ -81,6 +82,7 @@ class DatabaseInterface(object): msg.edited_timestamp = message.edited_timestamp msg.mentions = json.dumps(get_message_mentions(message.mentions)) msg.attachments = json.dumps(message.attachments) + msg.embeds = json.dumps(message.embeds) msg.author = json.dumps(get_message_author(message)) session.commit() diff --git a/discordbot/titanembeds/database/messages.py b/discordbot/titanembeds/database/messages.py index d7a9f20..b758ace 100644 --- a/discordbot/titanembeds/database/messages.py +++ b/discordbot/titanembeds/database/messages.py @@ -12,8 +12,9 @@ class Messages(Base): edited_timestamp = db.Column(db.TIMESTAMP) # Timestamp of when content is edited mentions = db.Column(db.Text()) # Mentions serialized attachments = db.Column(db.Text()) # serialized attachments + embeds = db.Column(db.Text().with_variant(db.Text(length=4294967295), 'mysql')) # message embeds - def __init__(self, guild_id, channel_id, message_id, content, author, timestamp, edited_timestamp, mentions, attachments): + def __init__(self, guild_id, channel_id, message_id, content, author, timestamp, edited_timestamp, mentions, attachments, embeds): self.guild_id = guild_id self.channel_id = channel_id self.message_id = message_id @@ -23,6 +24,7 @@ class Messages(Base): self.edited_timestamp = edited_timestamp self.mentions = mentions self.attachments = attachments + self.embeds = embeds def __repr__(self): return ''.format(self.id, self.guild_id, self.guild_id, self.channel_id, self.message_id) diff --git a/discordbot/titanembeds/socketio/socketiointerface.py b/discordbot/titanembeds/socketio/socketiointerface.py index 6c5249f..a9344b4 100644 --- a/discordbot/titanembeds/socketio/socketiointerface.py +++ b/discordbot/titanembeds/socketio/socketiointerface.py @@ -26,6 +26,7 @@ class SocketIOInterface: "edited_timestamp": edit_ts, "mentions": get_message_mentions(message.mentions), "attachments": message.attachments, + "embeds": message.embeds, } nickname = None if hasattr(message.author, 'nick') and message.author.nick: diff --git a/webapp/alembic/versions/7d6484faaccd_add_embed_column_to_messages.py b/webapp/alembic/versions/7d6484faaccd_add_embed_column_to_messages.py new file mode 100644 index 0000000..1218ee4 --- /dev/null +++ b/webapp/alembic/versions/7d6484faaccd_add_embed_column_to_messages.py @@ -0,0 +1,28 @@ +"""Add embed column to messages + +Revision ID: 7d6484faaccd +Revises: a5780c871aec +Create Date: 2017-11-04 06:39:41.926145 + +""" + +# revision identifiers, used by Alembic. +revision = '7d6484faaccd' +down_revision = 'a5780c871aec' +branch_labels = None +depends_on = None + +from alembic import op +import sqlalchemy as sa + + +def upgrade(): + # ### commands auto generated by Alembic - please adjust! ### + op.add_column('messages', sa.Column('embeds', sa.Text().with_variant(sa.Text(length=4294967295), 'mysql'), nullable=True)) + # ### end Alembic commands ### + + +def downgrade(): + # ### commands auto generated by Alembic - please adjust! ### + op.drop_column('messages', 'embeds') + # ### end Alembic commands ### diff --git a/webapp/titanembeds/database/messages.py b/webapp/titanembeds/database/messages.py index 8d0f205..abc58dc 100644 --- a/webapp/titanembeds/database/messages.py +++ b/webapp/titanembeds/database/messages.py @@ -14,8 +14,9 @@ class Messages(db.Model): edited_timestamp = db.Column(db.TIMESTAMP) # Timestamp of when content is edited mentions = db.Column(db.Text()) # Mentions serialized attachments = db.Column(db.Text()) # serialized attachments + embeds = db.Column(db.Text().with_variant(db.Text(length=4294967295), 'mysql')) # message embeds - def __init__(self, guild_id, channel_id, message_id, content, author, timestamp, edited_timestamp, mentions, attachments): + def __init__(self, guild_id, channel_id, message_id, content, author, timestamp, edited_timestamp, mentions, attachments, embeds): self.guild_id = guild_id self.channel_id = channel_id self.message_id = message_id @@ -25,6 +26,7 @@ class Messages(db.Model): self.edited_timestamp = edited_timestamp self.mentions = mentions self.attachments = attachments + self.embeds = embeds def __repr__(self): return ''.format(self.id, self.guild_id, self.guild_id, self.channel_id, self.message_id) @@ -40,6 +42,9 @@ def get_channel_messages(guild_id, channel_id, after_snowflake=None): if x.message_id in snowflakes: continue snowflakes.append(x.message_id) + embeds = x.embeds + if not embeds: + embeds = "[]" message = { "attachments": json.loads(x.attachments), "timestamp": x.timestamp, @@ -48,7 +53,8 @@ def get_channel_messages(guild_id, channel_id, after_snowflake=None): "author": json.loads(x.author), "content": x.content, "channel_id": x.channel_id, - "mentions": json.loads(x.mentions) + "mentions": json.loads(x.mentions), + "embeds": json.loads(embeds), } member = get_guild_member(guild_id, message["author"]["id"]) message["author"]["nickname"] = None diff --git a/webapp/titanembeds/static/css/embedstyle.css b/webapp/titanembeds/static/css/embedstyle.css index 901a162..5b94ca8 100644 --- a/webapp/titanembeds/static/css/embedstyle.css +++ b/webapp/titanembeds/static/css/embedstyle.css @@ -491,7 +491,6 @@ p.mentioned span.chatmessage { background-color: rgba(0, 0, 0, 0.2); color: #82b1ff; cursor: pointer; - } .chatmessage .channellink:hover { @@ -499,6 +498,92 @@ p.mentioned span.chatmessage { color: white; } +.embeds { + display: block; + width: 60%; +} + +@media(max-width: 600px) { + .embeds { + width: 100%; + } +} + +.richembed { + display: flex; + border: solid 1px grey; + background-color: rgba(0, 0, 0, 0.1); + border-radius: 10px; + overflow: hidden; + margin-top: 3px; +} + +.richembed .color { + width: 6px; + background-color: #cacbce; +} + +.richembed .rich { + margin: 10px; +} + +.richembed img { + border-radius: 5px; +} + +.richembed .author img, .richembed .footer img { + width: 20px; + border-radius: 100px; + vertical-align: bottom; +} + +.richembed .content { + display: flex; +} + +.richembed .thumbnail { + margin-left: 2px; +} + +.richembed .thumbnail img { + width: 100%; + max-width: 170px; +} + +.richembed .fields { + display: flex; + flex-direction: row; + flex-wrap: wrap; +} + +.richembed .field-name { + font-weight: bold; +} + +.richembed .field { + flex: 0; + min-width: 100%; +} + +.richembed .field.inline { + flex: 1; + flex-basis: auto; + min-width: 100px; +} + +@media(max-width: 600px) { + .richembed .field.inline { + flex: 0; + flex-basis: unset; + min-width: 100%; + } +} + +.richembed .image img { + max-width: 300px; + width: 100%; +} + #emoji-picker { color: black; position: fixed; diff --git a/webapp/titanembeds/static/js/embed.js b/webapp/titanembeds/static/js/embed.js index 35c69cd..c8d30e6 100644 --- a/webapp/titanembeds/static/js/embed.js +++ b/webapp/titanembeds/static/js/embed.js @@ -854,6 +854,34 @@ return "https://cdn.discordapp.com/avatars/" + user_id + "/" + avatar_hash + ".png"; } } + + function parse_message_embeds(embeds) { + var emb = []; + for (var i = 0; i < embeds.length; i++) { + var disembed = embeds[i]; + if (disembed.type != "rich") { + continue; + } + disembed.toRenderFooter = false; + if (disembed.footer) { + disembed.toRenderFooter = true; + } else if (disembed.timestamp) { + disembed.toRenderFooter = true; + } + disembed.footerVerticalBar = disembed.footer && disembed.timestamp; + if (disembed.timestamp) { + disembed.formatted_timestamp = moment(disembed.timestamp).format('ddd MMM Do, YYYY [at] h:mm A'); + } + if (disembed.color) { + disembed.hexColor = "#" + disembed.color.toString(16); + } + var template = $('#mustache_richembed').html(); + Mustache.parse(template); + var rendered = Mustache.render(template, disembed); + emb.push(rendered); + } + return emb; + } function fill_discord_messages(messages, jumpscroll, replace=null) { if (messages.length == 0) { @@ -906,6 +934,11 @@ select_channel($(this).attr("channelid"), true); }); } + var embeds = parse_message_embeds(message.embeds); + $("#discordmessage_"+message.id).parent().find("span.embeds").text(""); + for(var j = 0; j < embeds.length; j++) { + $("#discordmessage_"+message.id).parent().find("span.embeds").append(embeds[j]); + } var usrcachekey = username + "#" + message.author.discriminator; if (usrcachekey.startsWith("(Titan Dev) ")) { usrcachekey = usrcachekey.substr(12); @@ -943,7 +976,7 @@ jumpscroll = true; } else { fet = fetch(channel_id, last_message_id); - jumpscroll = element_in_view($('#discordmessage_'+last_message_id).parent(), true); + jumpscroll = element_in_view($('#discordmessage_'+last_message_id).parent()); } fet.done(function(data) { var status = data.status; @@ -1284,7 +1317,7 @@ if (selected_channel != thismsgchan) { return; } - var jumpscroll = element_in_view($('#discordmessage_'+last_message_id).parent(), true); + var jumpscroll = element_in_view($('#discordmessage_'+last_message_id).parent()); last_message_id = fill_discord_messages([msg], jumpscroll); }); diff --git a/webapp/titanembeds/templates/embed.html.j2 b/webapp/titanembeds/templates/embed.html.j2 index cd79396..27e7ffa 100644 --- a/webapp/titanembeds/templates/embed.html.j2 +++ b/webapp/titanembeds/templates/embed.html.j2 @@ -218,7 +218,7 @@ + + {% endraw %}