embedded.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>Converse.js</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.js: An XMPP chat client which can be integrated into any website" />
  9. <meta name="author" content="JC Brand" />
  10. <meta name="keywords" content="xmpp chat webchat converse.js" />
  11. <link rel="shortcut icon" type="image/ico" href="../css/images/favicon.ico"/>
  12. <link type="text/css" rel="stylesheet" media="screen" href="/css/font-awesome.min.css" />
  13. <link type="text/css" rel="stylesheet" media="screen" href="/css/website.css" />
  14. <script type="text/javascript" src="/src/website.js"></script>
  15. <script type="text/javascript" src="/analytics.js"></script>
  16. <noscript><p><img src="//stats.opkode.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
  17. <![if gte IE 11]>
  18. <link type="text/css" rel="stylesheet" media="screen" href="/css/converse.css" />
  19. <script src="/dist/converse.js"></script>
  20. <![endif]>
  21. <style>
  22. .converse-container {
  23. height: 55vh;
  24. }
  25. </style>
  26. </head>
  27. <body id="page-top" data-spy="scroll">
  28. <nav class="navbar sticky-top navbar-expand-lg" role="navigation">
  29. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
  30. <span class="navbar-toggler-icon"></span>
  31. </button>
  32. <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
  33. <a class="navbar-brand" href="/"><span class="converse-brand-heading"><i class="icon-conversejs"></i>Converse</span></a>
  34. <ul class="navbar-nav mt-2 mt-lg-0">
  35. <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
  36. <li class="hidden">
  37. <a class="nav-link" href="#page-top"></a>
  38. </li>
  39. <li class="nav-item page-scroll">
  40. <a class="nav-link" href="#about">About</a>
  41. </li>
  42. <li class="nav-item page-scroll">
  43. <a class="nav-link" href="#features">Features</a>
  44. </li>
  45. <li class="nav-item page-scroll">
  46. <a class="nav-link" href="#contact">Contact</a>
  47. </li>
  48. <li class="nav-item page-scroll">
  49. <a class="nav-link" href="#sponsors">Sponsor</a>
  50. </li>
  51. <li class="nav-item page-scroll">
  52. <a class="nav-link" href="#hosting">Hosting</a>
  53. </li>
  54. <li class="nav-item">
  55. <a class="nav-link" href="/docs/html/index.html">Documentation&nbsp;<i class="fa fa-external-link-alt"></i></a>
  56. </li>
  57. <li class="nav-item">
  58. <a class="nav-link" href="https://github.com/jcbrand/converse.js/releases" class="button" target="_blank" rel="noopener">Download&nbsp;<i class="fa fa-external-link-alt"></i></a>
  59. </li>
  60. </ul>
  61. </div>
  62. </nav>
  63. <section class="intro">
  64. <div class="intro-body">
  65. <div class="container">
  66. <div class="row">
  67. <div class="col-md-8 col-md-offset-2">
  68. <h1 class="brand-heading brand-heading-embedded"><a style="color: white;" href="/"><i class="icon-conversejs"></i>Converse</a></h1>
  69. <p class="intro-text">Embedded MUC chat demo</p>
  70. <div class="converse-container">
  71. <div id="conversejs"></div>
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. </section>
  78. </body>
  79. <script>
  80. converse.initialize({
  81. authentication: 'anonymous',
  82. auto_login: true,
  83. auto_join_rooms: [
  84. 'anonymous@conference.nomnom.im',
  85. ],
  86. bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
  87. jid: 'nomnom.im', // XMPP server which allows anonymous login (doesn't
  88. // allow chatting with other XMPP servers).
  89. notify_all_room_messages: [
  90. 'anonymous@conference.nomnom.im',
  91. ],
  92. locales_url: "../locale/{{{locale}}}/LC_MESSAGES/converse.json",
  93. view_mode: 'embedded',
  94. });
  95. </script>
  96. </html>