systems/eldiron/websites/im/www/converse.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3         <head>
   4                 <title>Converse</title>
   5                 <meta charset="utf-8">
   6                 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   7                 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   8                 <meta name="description" content="Converse: An XMPP chat client which can be integrated into any website" />
   9                 <meta name="keywords" content="xmpp chat webchat converse.js Converse" />
  10
  11                 <link type="text/css" rel="stylesheet" media="screen" href="https://assets.immae.eu/converse/{{converseVersion}}/dist/converse.min.css" />
  12                 <style type="text/css">
  13                 #conversejs div.chat-msg__text pre {
  14                         background-color: #eee;
  15                         padding: 10px;
  16                 }
  17                 </style>
  18                 <script src="https://assets.immae.eu/converse/{{converseVersion}}/3rdparty/libsignal-protocol.min.js"></script>
  19                 <script src="https://assets.immae.eu/converse/{{converseVersion}}/dist/converse.min.js"></script>
  20                 <script src="https://assets.immae.eu/marked/1.2.6/marked.min.js"></script>
  21                 <script src="https://assets.immae.eu/markdown-it/10.0.0/markdown-it.min.js"></script>
  22         </head>
  23         <body>
  24                 <script>
  25                         var md = window.markdownit({
  26                                 html: true,
  27                         });
  28                         converse.plugins.add('markdown', {
  29                                 //initialize () {
  30                                 //      const { _converse } = this;
  31                                 //      _converse.api.listen.on('afterMessageBodyTransformed', (view, text) => {
  32                                 //              let newtext = text.replace(/<br\/>/g, '\n').replace(/```/g, "\n```\n");
  33                                 //              newtext = md.render(newtext).replace(/^<p>/, "").replace(/<\/p>\s*$/, "");
  34                                 //              view.model.save({'message': newtext}, {'silent': true });
  35                                 //      });
  36                                 //}
  37                                 overrides: {
  38                                         MessageView: {
  39                                                 transformBodyText: async function(text) {
  40                                                         let newtext = await this.__super__.transformBodyText.apply(this, arguments);
  41                                                         newtext = newtext.replace(/<br\/>/g, '\n').replace(/```/g, "\n```\n");
  42                                                         return md.render(newtext).replace(/^<p>/, "").replace(/<\/p>\s*$/, "");
  43                                                 }
  44                                         }
  45                                 }
  46                         });
  47                         converse.initialize({
  48                                 //bosh_service_url: 'https://im.immae.fr/bosh',
  49                                 websocket_url: 'wss://im.immae.fr/ws',
  50                                 view_mode: 'fullscreen',
  51                                 show_controlbox_by_default: true,
  52                                 whitelisted_plugins: ['markdown'],
  53                         });
  54                 </script>
  55         </body>
  56 </html>
  57