im-changing.ru
/
converse.js
зеркало из https://github.com/conversejs/converse.js.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
							<!doctype html>
<html class="no-js" lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Converse.js Mockups</title>
    <link type="text/css" rel="stylesheet" media="screen" href="../../dist/converse.css" />
</head>

<body class="reset">
<div id="conversejs" class="fullscreen converse-fullscreen">
    <div class="sidebar"></div>
    <div class="converse-chatboxes row no-gutters">
        <div id="controlbox" class="chatbox">
            <div class="flyout box-flyout">
                <div class="controlbox-panes">
                    <div class="controlbox-pane"></div>
                </div>
            </div>
        </div>

        <div class="chatbox" id="chatbox-37c0c87392010303765fe36b05c0967d62c6b70f">
            <div class="flyout box-flyout">
                <div class="chat-head chat-head-chatbox row no-gutters">
                    <div class="col">
                        <div class="row no-gutters">
                            <div class="col chat-title" title="j@chat.example.org">Juliet Capulet
                                <p class="user-custom-message" title="On the balcony">On the balcony</p>
                            </div>
                        </div>
                    </div>
                    <div class="chatbox-buttons row no-gutters">
                        <a class="chatbox-btn fa fa-close" title="Close this chat box"></a>
                        <a class="chatbox-btn fa fa-vcard" title="Contact profile" data-toggle="modal" data-target="#contactProfileModal"></a>
                    </div>
                </div>

                <div class="chat-body">
                    <div class="chat-content">
                        <div class="message chat-info">This is an info message</div>
                        <div class="message chat-info chat-error">This is an error message</div>

                        <div class="message chat-msg">
                            <canvas data-avatar="/mockup/images/romeo.jpg" height="36" width="36" class="avatar chat-msg__avatar"></canvas>
                            <div class="chat-msg__content">
                                <span class="chat-msg__heading">
                                    <span class="chat-msg__author">Romeo Montague</span>
                                    <span class="chat-msg__time">15:31</span>
                                </span>
                                <div class="chat-msg__body">
                                    <div class="chat-msg__message">
                                        <span class="chat-msg__text">He jests at scars that never felt a wound.</span>
                                    </div>
                                </div>
                            </div>
                            <span class="fa fa-check chat-msg__receipt"></span>
                            <div class="chat-msg__actions">
                                <button class="chat-msg__action fa fa-pencil" title="Edit this message">&nbsp;</button>
                            </div>
                        </div>

                        <div class="message date-separator">
                            <hr class="separator">
                            <time class="separator-text" datetime="2018-06-04T00:00:00.000Z"><span>Tue Jun 04 2018</span></time>
                        </div>

                        <div class="message chat-msg">
                            <canvas data-avatar="/mockup/images/romeo.jpg" height="36" width="36" class="avatar chat-msg__avatar"></canvas>
                            <div class="chat-msg__content">
                                <span class="chat-msg__heading">
                                    <span class="chat-msg__author">Romeo Montague</span>
                                    <span class="chat-msg__time">15:31</span>
                                </span>
                                <div class="chat-msg__body">
                                    <div class="chat-msg__message">
                                        <span class="chat-msg__text">But soft, what light through yonder window breaks?</span>
                                    </div>
                                </div>
                            </div>
                            <span class="fa fa-check chat-msg__receipt"></span>
                            <i title="This message has been edited" class="fa fa-edit chat-msg__edit-modal"></i>
                            <div class="chat-msg__actions">
                                <button class="chat-msg__action fa fa-pencil" title="Edit this message">&nbsp;</button>
                            </div>
                        </div>

                        <div class="message chat-msg chat-msg-followup">
                            <canvas data-avatar="/mockup/images/romeo.jpg" height="36" width="36" class="avatar chat-msg__avatar"></canvas>
                            <div class="chat-msg__content">
                                <span class="chat-msg__heading">
                                    <span class="chat-msg__author">Romeo Montague</span>
                                    <span class="chat-msg__time">15:31</span>
                                </span>
                                <div class="chat-msg__body">
                                    <div class="chat-msg__message">
                                        <span class="chat-msg__text">It is the east and Juliet is the sun!</span>
                                    </div>
                                </div>
                            </div>
                            <span class="fa fa-check chat-msg__receipt"></span>
                            <div class="chat-msg__actions">
                                <button class="chat-msg__action fa fa-pencil" title="Edit this message">&nbsp;</button>
                            </div>
                        </div>

                        <div class="message chat-msg chat-msg-followup">
                            <canvas data-avatar="/mockup/images/romeo.jpg" height="36" width="36" class="avatar chat-msg__avatar"></canvas>
                            <div class="chat-msg__content">
                                <span class="chat-msg__heading">
                                    <span class="chat-msg__author">Romeo Montague</span>
                                    <span class="chat-msg__time">15:31</span>
                                </span>
                                <div class="chat-msg__body">
                                    <div class="chat-msg__message">
                                        <span class="chat-msg__text">Arise, fair sun, and kill the envious moon,</span>
                                    </div>
                                </div>
                            </div>
                            <span class="fa fa-check chat-msg__receipt"></span>
                            <div class="chat-msg__actions">
                                <button class="chat-msg__action fa fa-pencil" title="Edit this message">&nbsp;</button>
                            </div>
                        </div>

                        <div class="message chat-info chat-event">Romeo Montague is busy</div>

                        <div class="message chat-msg">
                            <canvas height="36" width="36" class="avatar chat-msg__avatar"></canvas>
                            <div class="chat-msg__content">
                                <span class="chat-msg__heading">
                                    <span class="chat-msg__author">Juliet Capulet</span>
                                    <span class="chat-msg__time">15:31</span>
                                    <span class="fa fa-lock"></span>
                                </span>
                                <div class="chat-msg__body">
                                    <div class="chat-msg__message">
                                        <span class="chat-msg__text">O Romeo, Romeo! wherefore art thou Romeo? Deny thy father and refuse thy name;</span>
                                    </div>
                                </div>
                            </div>
                            <div class="chat-msg__actions">
                                <button class="chat-msg__action fa fa-pencil" title="Edit this message">&nbsp;</button>
                            </div>
                        </div>

                        <div class="message chat-msg chat-msg--followup">
                            <canvas height="36" width="36" class="avatar chat-msg__avatar"></canvas>
                            <div class="chat-msg__content">
                                <span class="chat-msg__heading">
                                    <span class="chat-msg__author">Juliet Capulet</span>
                                    <span class="chat-msg__time">15:31</span>
                                    <span class="fa fa-lock"></span>
                                </span>
                                <div class="chat-msg__body">
                                    <div class="chat-msg__message">
                                        <span class="chat-msg__text">Or, if thou wilt not, be but sworn my love, And I'll no longer be a Capulet.</span>
                                    </div>
                                </div>
                            </div>
                            <div class="chat-msg__actions">
                                <button class="chat-msg__action fa fa-pencil" title="Edit this message">&nbsp;</button>
                            </div>
                        </div>
                    </div>

                    <form class="sendXMPPMessage">
                        <ul class="chat-toolbar no-text-select">
                            <li class="toggle-toolbar-menu toggle-smiley fa fa-smile-o" title="Insert a smiley">
                                <div class="emoji-picker-container toolbar-menu collapsed"></div>
                            </li>
                            <li class="toggle-toolbar-menu toggle-otr unencrypted" title="Your messages are not encrypted. Click here to enable OTR encryption.">
                                <span class="chat-toolbar-text">unencrypted</span>
                                <span class="fa fa-unlock"></span>
                                <ul class="toolbar-menu collapsed">
                                    <li>
                                        <a class="start-otr" href="#">Start encrypted conversation</a>
                                    </li>
                                    <li>
                                        <a href="http://www.cypherpunks.ca/otr/help/3.2.0/levels.php" target="_blank" rel="noopener">What's this?</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                        <textarea class="chat-textarea form-control" placeholder="Personal message"></textarea>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div id="converse-modals" class="modals"></div>
</div>

<script type="text/javascript" src="../../node_modules/lodash/lodash.js"></script>
<script type="text/javascript" src="../../node_modules/backbone/backbone.js"></script>
<script type="text/javascript" src="../../node_modules/backbone.nativeview/backbone.nativeview.js"></script>
<script type="text/javascript" src="../../node_modules/strophe.js/strophe.js"></script>
<script type="text/javascript" src="../../src/utils/core.js"></script>
<script type="text/javascript" src="utils.js"></script>
<script type="text/javascript" src="sidebar.js"></script>
<script type="text/javascript" src="controlbox.js"></script>
<script type="text/javascript" src="modals.js"></script>
<script type="text/javascript" src="../../node_modules/bootstrap.native/dist/bootstrap-native-v4.js"></script>

<script>
    document.addEventListener("DOMContentLoaded", function(event) { 
        new Modals();
        new Sidebar();
        new UserPanel();
    });
</script>

</body>
</html>