Quick Messages Plugin

For the menu, I using this css:

#navmenuv {
  position: absolute;
  z-index: 9999;
  height: 50px;
  margin-left: 670px;
}

#navmenuv li a {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  line-height: 60px;
  padding: 0 15px;
}

#navmenuv li a:hover {
  color: gray;
}

#navmenuv ul.nav {
    padding: 0;
    margin: 0;
}

#navmenuv .nav li {
    display:inline;
    padding:0;
    margin:0;
}

And:

<div id="navmenucontainer" class="container">
  <div id="navmenuv">
    <ul class="nav">
      <li><a href="http://commonmark.org/">Home</a></li>
      <li><a href="http://spec.commonmark.org/">Download</a></li>
      <li><a href="http://code.commonmark.org/">Gallery</a></li>
      <li><a href="http://try.commonmark.org/">Support</a></li>
    </ul>
  </div>
</div>

For the white text, I’m using the personal color:

EDIT:
I tried disable the header menu, but the problem persists…
It is aligned to the far left…

Ah yes, it’s because of my little hack. I just reverted it. Pull in the latest and try again.

Will have to tweak that hack slightly…

1 Like

It’s worked for me ^^

I think I found an error…
When I click on the arrow, the chat disappears… is a bug?

I’m assuming nothing was entered in the composer? That’s intended actually. It’s the same as the normal Discourse compose. Try clicking on the arrow on the far right of the composer on meta.discourse.org when you haven’t written anything. If you enter text it will minimize rather than disappear.

edit: But yeah, that’s something I did consider changing from the normal Discourse compose experience. Decided not to for now.

1 Like

Thanks for the explanation ^^’

1 Like

Ok the hack to make the header button align with Babble’s should work without interfering in other css now.

cc @Na2HPO4

https://github.com/angusmcleod/discourse-quick-messages/commit/1fb2aab867f392b1c64431902866b26dd6b78e7f

1 Like

Uploads are now working for each individual quick message compose.

https://github.com/angusmcleod/discourse-quick-messages/commit/b3b696bdac79cce1901a8dae9b34bceb2cddd529

5 Likes

Thanks for the update =D

But, I have a one question…
How can change the css color for the icon? (upload etc?)
Now, I see the white color…

Ah the ole white theme strikes again.

Try now :slight_smile:

https://github.com/angusmcleod/discourse-quick-messages/commit/7ab080b141f5120268cee907a96a2c5a9ca96516

2 Likes

Interesting plugin indeed. we’ll include this in my list and let me users spin it. :slight_smile:

1 Like

This is how my quick message plugin looks when someone message me:

Is this okay? @angus

Are you also using my Topic List Previews plugin by any chance? This happens if you use both of these together at the moment. I will be fixing this, so you can use both together, soon.

2 Likes

yha. i think i am. ill disable that for the time being.

but it’s a default plugin right? can’t do anything about it?

No, quick messages is not a default plugin (in the sense that is comes with Discourse), you will have to remove it from your plugins directory/app.yml and then perform a rebuild to remove it.

got it. thanks

fixed now.

@Rodelio_Lagahit @Roxelle Ok this issue should be fixed now. You can use Quick Messages and Topic List Previews together safely now.

What was happening was that both Quick Messages and Topic List Previews were overriding the excerpt and include_excerpt methods used in the Listable Topic (or Topic List Item) serializer. So I just moved Quick Messages over to a new method message_excerpt so the two would not conflict.

def message_excerpt
  if object.archetype == Archetype.private_message
     cooked = Post.where(topic_id: object.id, post_number: object.highest_post_number).pluck('cooked')
     excerpt = PrettyText.excerpt(cooked[0], 200, keep_emoji_images: true)
     excerpt.gsub!(/(\[image\])/, "<i class='fa fa-picture-o'></i>") if excerpt
     excerpt
  else
     return false
  end
end

def include_message_excerpt?
  !!message_excerpt
end

https://github.com/angusmcleod/discourse-quick-messages/commit/2a71ff7c83f253edeea1d43224b1ef6c779cf836

Btw, notice that, like in Topic List Previews, I’m stripping out the [image] text which acts as a placeholder for an image in a excerpt.

excerpt.gsub!(/(\[image\])/, "<i class='fa fa-picture-o'></i>") if excerpt

This was originally a request for Topic List Previews, and I also think that having ‘[image]’ placeholders in excerpts looks a little…unpolished. I’m experimenting here with putting the Font Awesome icon fa-picture-o in its place so that there is still a placeholder for images in excerpts. If message only contains an image some kind of placeholder is necessary, otherwise the excerpt will show up blank. Any feedback or ideas on that are welcome.

6 Likes

Ok, I update and try now… =D

The concept fits very well in the Discourse paradigm. Thank you very much for your great work.

Has the issue with your topic list preview plugin been fixed since then? I wanted to use both.

Issue

After clicking on the “close” button, the input textarea gets hidden, but the chatbox remains open and I can’t close it anymore wherever I click.

Has the issue with your topic list preview plugin been fixed since then? I wanted to use both.

@meglio Yup!

1 Like