<div style="width: 450px;">
	<p class="lead"># {[{ channel.tag || user.name }]} <span class="pull-right" ng-show="channel.related_type && channel.related_id"><a ng-href="{!! URL::to('tasks') !!}/{[{ channel.related_id }]}" class="btn btn-sm"><i class="fa fa-external-link"></i> Open task</a></span></p>
	<div ng-show="channel.public == '0'" style="margin-top: -10px; margin-bottom: 10px;"><small><i class="fa fa-lock"></i> There are {[{ channel.users.length }]} people in this channel. <a href="#" ng-click="showSettings()" data-eat-click>Invite more</a></small></div>

	<div class="chat-messages" data-chat-scroll>

		<p class="muted" ng-hide="messages.length > 0 || loading">No messages were found.</p>
		<p class="muted text-center" ng-show="loading"><i class="fa fa-spinner fa-spin"></i> Loading previous messages...</p>
		<ul class="media-list" ng-hide="loading">
			<li ng-repeat="message in messages | orderBy:'created_at'">

				<!-- Render a normal chat message -->
				<div class="media chat-item" ng-if="message.thread_id">
					<a class="pull-left" href="#" data-eat-click>
						<img class="media-object" style="width: 40px;" ng-src="{[{ message.from.profile_photo_url }]}">
					</a>
					<div class="media-body">
						<h5 class="media-heading"><strong ng-hide="message.own">{[{ message.from.name }]}</strong><strong ng-show="message.own" class="text-info">Me</strong> <small class="muted pull-right"><i class="fa fa-clock-o"></i> {[{ message.created_at | moment:"HH:mm" }]}</small></h5>
						<p><small>{[{ message.message }]}</small></p>
					</div>
				</div>


				<!-- Render a file -->
				<div ng-if="message.filename" class="chat-file" style="">
					<i class="fa fa-file"></i> {[{ message.creator.name }]} uploaded <a ng-href="{!! URL::to('files/download') !!}/{[{ message.id }]}">{[{ message.name }]}</a> <small class="muted pull-right"><i class="fa fa-clock-o"></i> {[{ message.created_at | moment:"HH:mm" }]}</small>
				</div>
			</li>
		</ul>

	</div>
	<form ng-submit="send()">
		<div class="form-actions">
			<div class="input-group">
				<span class="input-group-btn">
					<div class="btn-group text-left dropup">
						<span class="btn btn-default dropdown-toggle" data-toggle="dropdown">
							<i class="fa fa-arrow-circle-o-up"></i>
						</span>
						<ul class="dropdown-menu">
							<li>
								<a tabindex="-1" href="#" class="file-upload" ng-click="uploadFile($event)">
									<i class="fa fa-file fa-fw"></i> Upload a file
									<input type="file" name="files" data-files="files" style="width: 100%;" data-related-id="{[{ channel.id }]}" data-related-type="chat" fileupload>
								</a>
							</li>
							<li ng-show="channel.public == '0'"><a tabindex="-1" href="#" ng-click="showSettings()" data-eat-click><i class="fa fa-cogs fa-fw"></i> Channel settings</a></li>
							<li ng-show="channel.public == '0'"><a tabindex="-1" href="#" ng-confirm-click="Are you sure you want to leave this channel?" data-confirmed-click="leave()" data-eat-click><i class="fa fa-sign-out fa-fw"></i> Leave channel</a></li>
						</ul>
					</div>
				</span>
				<input type="text" class="form-control" ng-model="data.message" placeholder="Write your message here..." required>
				<span class="input-group-btn">
					<button class="btn btn-default" type="submit">Send</button>
				</span>
			</div>
			<div class="text-left">
				<label class="checkbox inline" ng-if="channel.related_id && channel.related_type">
					<input type="checkbox" ng-model="data.save_comment" value="1"> Save to comments
				</label>
				<label class="checkbox inline" ng-if="direct_message && user.email">
					<input type="checkbox" ng-model="data.send_email" value="1"> Send email
				</label>
				<label class="checkbox inline" ng-if="direct_message && user.mobile">
					<input type="checkbox" ng-model="data.send_text" value="1"> Send text
				</label>
			</div>
		</div>
	</form>
</div>