bigbluebutton-Github/labs/meteor-client/client/views/chat/chat_bar.html

69 lines
2.1 KiB
HTML
Executable File

<template name="chatbar">
<div id="{{id}}" {{visibility name}} class="component">
<div id="chatbar-contents">
<h3 class="title gradientBar"><span class="glyphicon glyphicon-comment"></span> {{title}}</h3>
{{>tabButtons}}
{{#if getInSession "display_chatPane"}}
<div id="chatbody">
<ul class="chat">
{{#each getFormattedMessagesForChat}}
<li>{{> message}}</li>
{{/each}}
</ul>
</div>
<div class="panel-footer">{{> chatInput}}</div>
{{else}}
{{> optionsBar}}
{{/if}}
</div>
</div>
</template>
<template name="chatInput">
<div class="chat-input-wrapper">
<input type="text" id="newMessageInput" placeholder="Write a message..." rel="tooltip" data-placement="top" title="Write a new message" />
<button type="submit" id="sendMessageButton" class="btn" rel="tooltip" data-placement="top" title="Click to send your message">
Send
</button>
</div>
</template>
<!-- Displays and styles an individual message in the chat -->
<template name="message">
<strong>{{message.from_username}}</strong>
<small class="pull-right">{{message.from_time}} <span class="glyphicon glyphicon-time"></span></small>
<div>{{message.message}}</div>
</template>
<!-- Displays the list of options available -->
<template name="optionsBar">
<p>Select a person to chat with privately</p>
<div class="private-chat-user-box">
{{#Layout template="scrollWindow" id="privateChatUserScrollWindow"}}
{{#contentFor region="scrollContents"}}
<table class="table table-hover">
<tbody class="private-chat-user-list">
{{#each getUsersInMeeting}}
<tr class="private-chat-user-entry">
{{#unless isCurrentUser userId}}
{{user.name}}
{{/unless}}
</tr>
{{/each}}
</tbody>
</table>
{{/contentFor}}
{{/Layout}}
</div>
</template>
<!-- Display buttons on the chat tab, public, options, and all the private chat tabs -->
<template name="tabButtons">
<ul id="tabButtonContainer" class="nav nav-tabs">
{{#each getChatbarTabs}}
{{{makeTabButton}}}
{{/each}}
</ul>
</template>