Top Menu

Jump to content
Home
    • Projects
    • Work packages
    • News
    • Getting started
    • Introduction video
      Welcome to OpenProject Community
      Get a quick overview of project management and team collaboration with OpenProject. You can restart this video from the help menu.
    • Help and support
    • User guides
    • Videos
    • Shortcuts
    • Community forum
    • Professional support
    • Additional resources
    • Data privacy and security policy
    • Digital accessibility (DE)
    • OpenProject website
    • Security alerts / Newsletter
    • OpenProject blog
    • Release notes
    • Report a bug
    • Development roadmap
    • Add and edit translations
    • API documentation
  • Sign in
      Forgot your password?
      Create a new account

      or sign in with your existing account

      Google

Side Menu

  • Overview
  • Activity
  • Roadmap
  • Work packages
  • Calendars
  • Team planners
  • Boards
  • Forums
  • Wiki
    • Table of contents
      • Expanded. Click to collapseCollapsed. Click to showDeveloper
        • Hierarchy leafAccessibility Checklist
        • Hierarchy leafCode Review Guidelines
        • Expanded. Click to collapseCollapsed. Click to showContribution
          • Hierarchy leafGit Workflow
          • Hierarchy leafTranslations
        • Expanded. Click to collapseCollapsed. Click to showDeveloping Plugins
          • Hierarchy leafDeveloping an OmniAuth Authentication Plugin
        • Hierarchy leafRelease Process
        • Hierarchy leafReport a bug
        • Hierarchy leafSecurity
        • Hierarchy leafSetting up an OpenLDAP server for testing
        • Hierarchy leafTheme Features
      • Hierarchy leafDownload
      • Expanded. Click to collapseCollapsed. Click to showFeature tour
        • Hierarchy leafRelease Notes OpenProject 30
        • Expanded. Click to collapseCollapsed. Click to showRelease Notes OpenProject 30 - Overview
          • Hierarchy leafGlossary
          • Hierarchy leafRelease Notes - Accessibility
          • Hierarchy leafRelease Notes - Accessibility changes
          • Hierarchy leafRelease Notes - Add work package queries as menu items to sidebar
          • Hierarchy leafRelease Notes - Copy projects based on Templates
          • Hierarchy leafRelease Notes - Design changes
          • Hierarchy leafRelease Notes - Fixed Bugs
          • Hierarchy leafRelease Notes - Keyboard Shortcuts
          • Hierarchy leafRelease Notes - Project settings
          • Hierarchy leafRelease Notes - Ruby&Rails Update
          • Hierarchy leafRelease Notes - Security
          • Hierarchy leafRelease Notes - Timelines
          • Hierarchy leafRelease Notes - Work packages
      • Hierarchy leafHowto create animated gifs
      • Hierarchy leafMigration Squashing
      • Hierarchy leafMod security
      • Hierarchy leafNew work package page
      • Hierarchy leafOP3 to OP4 Debian upgrade
      • Hierarchy leafOP4 Ubuntu1404 Stable with MySQL in production
      • Hierarchy leafOpenProject 40 Development Setup
      • Expanded. Click to collapseCollapsed. Click to showOpenProject Foundation
        • Hierarchy leafBoards
        • Hierarchy leafMembers
        • Hierarchy leafOPF-Meetings
        • Hierarchy leafStatutes
      • Expanded. Click to collapseCollapsed. Click to showRelease Notes
        • Hierarchy leafOpenProject released on Bitnami
      • Expanded. Click to collapseCollapsed. Click to showRelease Notes OpenProject 40 - Overview
        • Hierarchy leafRelease Notes OpenProject 40 - Accessibility improvements
        • Hierarchy leafRelease Notes OpenProject 40 - Column header functions in work package table
        • Hierarchy leafRelease Notes OpenProject 40 - Improved Design
        • Hierarchy leafRelease Notes OpenProject 40 - Integrated query title on work package page
        • Hierarchy leafRelease Notes OpenProject 40 - Integrated toolbar on work package page
        • Hierarchy leafRelease Notes OpenProject 40 - OmniAuth integration for OpenProject
        • Hierarchy leafRelease Notes OpenProject 40 - Work package details pane
      • Expanded. Click to collapseCollapsed. Click to showSecurity and privacy
        • Hierarchy leafFAQ
      • Expanded. Click to collapseCollapsed. Click to showSupport
        • Expanded. Click to collapseCollapsed. Click to showDownload and Installation
          • Hierarchy leafInstallation MacOS
          • Expanded. Click to collapseCollapsed. Click to showInstallation OpenProject 3 0
            • Hierarchy leafDebian Stable with MySQL in production
            • Hierarchy leafInstallation Ubuntu
            • Hierarchy leafInstallation Windows
            • Hierarchy leafInstallation on Centos 65 x64 with Apache and PostgreSQL 93
          • Expanded. Click to collapseCollapsed. Click to showInstallation OpenProject 40
            • Hierarchy leafOP4 Debian Stable with MySQL in production
          • Expanded. Click to collapseCollapsed. Click to showMigration paths
            • Hierarchy leafFrom Chilliproject to OpenProject
            • Hierarchy leafMigration 15 to 30
            • Hierarchy leafMigration 24 to 30
            • Hierarchy leafMigration Redmine 2x › OpenProject 30
            • Hierarchy leafOpenProject 3 Migration
          • Hierarchy leafOpenProject 40
        • Expanded. Click to collapseCollapsed. Click to showNews
          • Hierarchy leafNew OpenProject Translations Plugin
          • Hierarchy leafNew Plugin on OpenProjectorg Local Avatars
          • Hierarchy leafNew design for OpenProject
          • Hierarchy leafNews Accessibility workshop for OpenProject
          • Hierarchy leafNews Glossary for OpenProject
          • Hierarchy leafNews Heartbleed fixed
          • Hierarchy leafNews Icon Fonts
          • Hierarchy leafNews OpenProject 30 Release
          • Hierarchy leafNews Release GitHub Integration Plugin
          • Hierarchy leafNews Success Story Deutsche Telekom
          • Hierarchy leafNews Timelines
          • Hierarchy leafOpenProject 3013 released
          • Hierarchy leafOpenProject 3017 released
          • Hierarchy leafOpenProject 40 released
          • Hierarchy leafOpenProject 40 will be coming soon
          • Hierarchy leafOpenProject 405 released
          • Hierarchy leafOpenProject and pkgrio
          • Hierarchy leafOpenProject news moved to a new blog
          • Hierarchy leafOpenProjectBitnami
          • Hierarchy leafPackager version with plugins released ("Community edition")
          • Hierarchy leafRegistration OpenProject-Foundation
          • Hierarchy leafRelease OpenProject AuthPlugins
          • Hierarchy leafUpdates on OpenProject
          • Hierarchy leafWe need your feedback for the the new fullscreen view for work packages
        • Hierarchy leafOpenProject Plug-Ins
      • Expanded. Click to collapseCollapsed. Click to showWiki
        • Hierarchy leaf2nd Level Support
You are here:
  • Forums
  • Development

Content

Simple chat plugin

Added by Markus Wende about 3 years ago

Hello OpenProject Community,

I am a beginner rails developer and I try to develope a simple chat plugin for OpenProject. I used

mickygingers walkthrough and adapted it to run as a plugin. 

What I have so far is a simple chat for all users on my OpenProject server. Here are some 

pictures of the rendered plugin:

(sorry for mixing languages (english + german) in the pictures)

My question is now.. How do I implement the ckeditor used by OpenProject instead of the simple form text_area.

The index.html.erb of the messages view looks like:

<%= form_for [@conversation, @message] do |f| %>
  <div class="custom-form">
    <div class="form-group">
    <%= f.text_area :body, autofocus: true, placeholder: "Your message", class: "form-control", rows: 5 %>
    </div>
    <%= f.button t(:send), class: 'button -highlight -with-icon icon-checkmark' %>
  </div>
<% end %>

<div id="conversation_messages">
  <% @conversation.conversation_messages.reverse_each do |message| %>
    <% if message.body %>
      <div class="media">
        <div class="media-left">
          <%= avatar(message.user) %> <strong> <%= message.user.name %> </strong> <%= message.message_time %>
        </div>
        <div class="media-body">
          <p><%= simple_format message.body %></p>
        </div>
      </div>
    <% end %>
  <% end %>
</div>

Thx, for the help.

--

Markus


Replies (5)

RE: Simple chat plugin - Added by Oliver Günther about 3 years ago

Hi Markus,

change your text_area as follows to add a class we use for positioning and use the with_text_formatting flag

    <%= f.text_area :body, class: 'wiki-edit', with_text_formatting: true, autofocus: true, placeholder: "Your message", class: "form-control", rows: 5 %>

That should be all!

Best,

Oliver

RE: Simple chat plugin - Added by Markus Wende about 3 years ago

Hey Oliver,

Thank you for your support. Your hint to use the with_text_formatting  flag was very good.

I had to change some more things to get it up and running. For every one who is interested, here the

new index.html.erb:

<%= labelled_tabular_form_for [@conversation, @message] do |f|%>
  <div class="custom-form">
    <%= f.text_area :body,
                    :cols => 80,
                    :rows => 5,
                    label: "&#8203;".html_safe,
                    container_class: '-xxwide',
                    with_text_formatting: true %>
  </div>
  <%= f.button t(:send), class: 'button -highlight -with-icon icon-checkmark' %>
  <hr class="form-separator">
<% end %>



<div id="conversation_messages">
  <% @conversation.conversation_messages.last(11).reverse_each do |message| %>
    <% if message.body %>
      <div class="media">
        <div class="media-left">
          <%= avatar(message.user) %> <strong> <%= message.user.name %> </strong> <%= message.message_time %>
        </div>
        <div class="media-body">
          <p><%= format_text message.body %></p>
        </div>
      </div>
    <% end %>
  <% end %>
</div>

I think this topic is now closed. Looks good to me (⌐■_■)

--

Markus

RE: Simple chat plugin - Added by Timotheus Pokorra over 2 years ago

Hello @Markus,
I wonder if you were able to have a working prototype for your plugin?
Will you publish it as open source?
Thank you,
  Timotheus

RE: Simple chat plugin - Added by Markus Wende over 2 years ago

Hello Timotheus,

I had a working prototype. But after the last update its not working
anymore. It is ok for me if you use my code, but I don't publish the
plugin, because I am not working on it anymore and its not ready
to be published.

Markus

RE: Simple chat plugin - Added by Timotheus Pokorra over 2 years ago

Hello Markus,
That would be great if you could send me the code to my email address: timotheus at pokorra.de
I have not worked with ruby before, but I would like to have a go at this challenge.
Thank you,
  Timotheus

  • (1 - 5/5)
Loading...