mirror of
https://github.com/YunoHost-Apps/hubzilla_ynh.git
synced 2024-09-03 19:26:21 +02:00
228 lines
9.4 KiB
Smarty
228 lines
9.4 KiB
Smarty
<div class="generic-content-wrapper">
|
|
<div class="section-title-wrapper">
|
|
<div class="pull-right">
|
|
<button id="fullscreen-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen(); adjustFullscreenTopBarHeight();"><i class="icon-resize-full"></i></button>
|
|
<button id="inline-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen(false); adjustInlineTopBarHeight();"><i class="icon-resize-small"></i></button>
|
|
{{if $is_owner}}
|
|
<form id="chat-destroy" method="post" action="chat">
|
|
<input type="hidden" name="room_name" value="{{$room_name}}" />
|
|
<input type="hidden" name="action" value="drop" />
|
|
<button class="btn btn-danger btn-xs" type="submit" name="submit" value="{{$drop}}" onclick="return confirmDelete();"><i class="icon-trash"></i> {{$drop}}</button>
|
|
</form>
|
|
{{/if}}
|
|
</div>
|
|
<h2>{{$room_name}}</h2>
|
|
<div class="clear"></div>
|
|
</div>
|
|
<div id="chatContainer" class="section-content-wrapper">
|
|
<div id="chatTopBar">
|
|
<div id="chatLineHolder"></div>
|
|
</div>
|
|
<div class="clear"></div>
|
|
<div id="chatBottomBar" >
|
|
<form id="chat-form" method="post" action="#">
|
|
<input type="hidden" name="room_id" value="{{$room_id}}" />
|
|
<div class="form-group">
|
|
<textarea id="chatText" name="chat_text" class="form-control"></textarea>
|
|
</div>
|
|
<div id="chat-submit-wrapper">
|
|
<div id="chat-submit" class="dropup pull-right">
|
|
<button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown"><i class="icon-caret-up"></i></button>
|
|
<button class="btn btn-primary btn-sm" type="submit" id="chat-submit" name="submit" value="{{$submit}}">{{$submit}}</button>
|
|
<ul class="dropdown-menu">
|
|
<li class="nav-item"><a class="nav-link" href="{{$baseurl}}/chatsvc?f=&room_id={{$room_id}}&status=online"><i class="icon-circle online"></i> {{$online}}</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="{{$baseurl}}/chatsvc?f=&room_id={{$room_id}}&status=away"><i class="icon-circle away"></i> {{$away}}</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="{{$baseurl}}/chat/{{$nickname}}/{{$room_id}}/leave"><i class="icon-circle leave"></i> {{$leave}}</a></li>
|
|
{{if $bookmark_link}}
|
|
<li class="divider"></li>
|
|
<li class="nav-item"><a class="nav-link" href="{{$bookmark_link}}" target="_blank" ><i class="icon-bookmark"></i> {{$bookmark}}</a></li>
|
|
{{/if}}
|
|
</ul>
|
|
</div>
|
|
<div id="chat-tools" class="btn-toolbar pull-left">
|
|
<div class="btn-group">
|
|
<button id="main-editor-bold" class="btn btn-default btn-sm" title="{{$bold}}" onclick="inserteditortag('b', 'chatText'); return false;">
|
|
<i class="icon-bold jot-icons"></i>
|
|
</button>
|
|
<button id="main-editor-italic" class="btn btn-default btn-sm" title="{{$italic}}" onclick="inserteditortag('i', 'chatText'); return false;">
|
|
<i class="icon-italic jot-icons"></i>
|
|
</button>
|
|
<button id="main-editor-underline" class="btn btn-default btn-sm" title="{{$underline}}" onclick="inserteditortag('u', 'chatText'); return false;">
|
|
<i class="icon-underline jot-icons"></i>
|
|
</button>
|
|
<button id="main-editor-quote" class="btn btn-default btn-sm" title="{{$quote}}" onclick="inserteditortag('quote', 'chatText'); return false;">
|
|
<i class="icon-quote-left jot-icons"></i>
|
|
</button>
|
|
<button id="main-editor-code" class="btn btn-default btn-sm" title="{{$code}}" onclick="inserteditortag('code', 'chatText'); return false;">
|
|
<i class="icon-terminal jot-icons"></i>
|
|
</button>
|
|
</div>
|
|
<div class="btn-group hidden-xs">
|
|
<button id="chat-link-wrapper" class="btn btn-default btn-sm" onclick="chatJotGetLink(); return false;" >
|
|
<i id="chat-link" class="icon-link jot-icons" title="{{$insert}}" ></i>
|
|
</button>
|
|
</div>
|
|
{{if $feature_encrypt}}
|
|
<div class="btn-group hidden-xs">
|
|
<button id="chat-encrypt-wrapper" class="btn btn-default btn-sm" onclick="red_encrypt('{{$cipher}}', '#chatText', $('#chatText').val()); return false;">
|
|
<i id="chat-encrypt" class="icon-key jot-icons" title="{{$encrypt}}" ></i>
|
|
</button>
|
|
</div>
|
|
{{/if}}
|
|
<div class="btn-group dropup visible-xs">
|
|
<button type="button" id="more-tools" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
|
|
<i id="more-tools-icon" class="icon-caret-up jot-icons"></i>
|
|
</button>
|
|
<ul class="dropdown-menu dropdown-menu-right" role="menu">
|
|
<li class="visible-xs"><a href="#" onclick="chatJotGetLink(); return false;" ><i class="icon-link"></i> {{$insert}}</a></li>
|
|
{{if $feature_encrypt}}
|
|
<li class="divider"></li>
|
|
<li class="visible-xs"><a href="#" onclick="red_encrypt('{{$cipher}}', '#chatText' ,$('#chatText').val()); return false;"><i class="icon-key"></i> {{$encrypt}}</a></li>
|
|
{{/if}}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div id="chat-rotator-wrapper" class="pull-left">
|
|
<div id="chat-rotator"></div>
|
|
</div>
|
|
<div class="clear"></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
var room_id = {{$room_id}};
|
|
var last_chat = 0;
|
|
var chat_timer = null;
|
|
|
|
$(document).ready(function() {
|
|
$('#chatTopBar').spin('small');
|
|
chat_timer = setTimeout(load_chats,300);
|
|
$('#chatroom_bookmarks, #vcard').hide();
|
|
$('#chatroom_list, #chatroom_members').show();
|
|
adjustInlineTopBarHeight();
|
|
});
|
|
|
|
$(window).resize(function () {
|
|
if($('main').hasClass('fullscreen')) {
|
|
adjustFullscreenTopBarHeight();
|
|
}
|
|
else {
|
|
adjustInlineTopBarHeight();
|
|
}
|
|
});
|
|
|
|
$('#chat-form').submit(function(ev) {
|
|
$('body').css('cursor','wait');
|
|
$.post("chatsvc", $('#chat-form').serialize(),function(data) {
|
|
if(chat_timer) clearTimeout(chat_timer);
|
|
$('#chatText').val('');
|
|
load_chats();
|
|
$('body').css('cursor','auto');
|
|
},'json');
|
|
ev.preventDefault();
|
|
});
|
|
|
|
function load_chats() {
|
|
$.get("chatsvc?f=&room_id=" + room_id + '&last=' + last_chat + ((stopped) ? '&stopped=1' : ''),function(data) {
|
|
if(data.success && (! stopped)) {
|
|
update_inroom(data.inroom);
|
|
update_chats(data.chats);
|
|
$('#chatTopBar').spin(false);
|
|
}
|
|
});
|
|
|
|
chat_timer = setTimeout(load_chats,10000);
|
|
|
|
}
|
|
|
|
function update_inroom(inroom) {
|
|
var html = document.createElement('div');
|
|
var count = inroom.length;
|
|
$.each( inroom, function(index, item) {
|
|
var newNode = document.createElement('div');
|
|
newNode.setAttribute('class', 'member-item');
|
|
$(newNode).html('<img style="height: 32px; width: 32px;" src="' + item.img + '" alt="' + item.name + '" /> ' + '<span class="name">' + item.name + '</span><br /><span class="' + item.status_class + '">' + item.status + '</span>');
|
|
html.appendChild(newNode);
|
|
});
|
|
$('#chatMembers').html(html);
|
|
}
|
|
|
|
function update_chats(chats) {
|
|
var count = chats.length;
|
|
$.each( chats, function(index, item) {
|
|
last_chat = item.id;
|
|
var newNode = document.createElement('div');
|
|
|
|
if(item.self) {
|
|
newNode.setAttribute('class', 'chat-item-self clear');
|
|
$(newNode).html('<div class="chat-body-self"><div class="chat-item-title-self wall-item-ago"><span class="chat-item-name-self">' + item.name + ' </span><span class="autotime chat-item-time-self" title="' + item.isotime + '">' + item.localtime + '</span></div><div class="chat-item-text-self">' + item.text + '</div></div><img class="chat-item-photo-self" src="' + item.img + '" alt="' + item.name + '" />');
|
|
}
|
|
else {
|
|
newNode.setAttribute('class', 'chat-item clear');
|
|
$(newNode).html('<img class="chat-item-photo" src="' + item.img + '" alt="' + item.name + '" /><div class="chat-body"><div class="chat-item-title wall-item-ago"><span class="chat-item-name">' + item.name + ' </span><span class="autotime chat-item-time" title="' + item.isotime + '">' + item.localtime + '</span></div><div class="chat-item-text">' + item.text + '</div></div>');
|
|
}
|
|
$('#chatLineHolder').append(newNode);
|
|
$(".autotime").timeago();
|
|
|
|
var elem = document.getElementById('chatTopBar');
|
|
elem.scrollTop = elem.scrollHeight;
|
|
});
|
|
}
|
|
|
|
function chatJotGetLink() {
|
|
reply = prompt("{{$linkurl}}");
|
|
if(reply && reply.length) {
|
|
$('#chat-rotator').spin('tiny');
|
|
$.get('linkinfo?f=&url=' + reply, function(data) {
|
|
addmailtext(data);
|
|
$('#chat-rotator').spin(false);
|
|
});
|
|
}
|
|
}
|
|
|
|
function addmailtext(data) {
|
|
var currentText = $("#chatText").val();
|
|
$("#chatText").val(currentText + data);
|
|
}
|
|
|
|
function adjustFullscreenTopBarHeight() {
|
|
$('#chatTopBar').height($(window).height() - $('#chatBottomBar').outerHeight(true) - $('.section-title-wrapper').outerHeight(true) - 16);
|
|
$('#chatTopBar').scrollTop($('#chatTopBar').prop('scrollHeight'));
|
|
}
|
|
|
|
function adjustInlineTopBarHeight() {
|
|
$('#chatTopBar').height($(window).height() - $('#chatBottomBar').outerHeight(true) - $('.section-title-wrapper').outerHeight(true) - $('nav').outerHeight(true) - 23);
|
|
$('#chatTopBar').scrollTop($('#chatTopBar').prop('scrollHeight'));
|
|
}
|
|
|
|
function isMobile() {
|
|
if( navigator.userAgent.match(/Android/i)
|
|
|| navigator.userAgent.match(/webOS/i)
|
|
|| navigator.userAgent.match(/iPhone/i)
|
|
|| navigator.userAgent.match(/iPad/i)
|
|
|| navigator.userAgent.match(/iPod/i)
|
|
|| navigator.userAgent.match(/BlackBerry/i)
|
|
|| navigator.userAgent.match(/Windows Phone/i)
|
|
){
|
|
return true;
|
|
}
|
|
else {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
$(function(){
|
|
$('#chatText').keypress(function(e){
|
|
if (e.keyCode == 13 && e.shiftKey||isMobile()) {
|
|
//do nothing
|
|
}
|
|
else if (e.keyCode == 13) {
|
|
e.preventDefault();
|
|
$('#chat-form').trigger('submit');
|
|
}
|
|
});
|
|
});
|
|
</script>
|