franzz/databap
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Desktop Notifications

Browse Source
This commit is contained in:
Franzz
2020-09-24 00:22:31 +02:00
parent c1663de541
commit 36dc674ba4
5 changed files with 296 additions and 233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

158
masks/chat.html
View File

@@ -24,7 +24,7 @@
</div>
<div id="chat_input" class="round">
<form id="chat_form" name="chat_form">
</form>
</div>
</div>
@@ -80,7 +80,7 @@ databap.pageInit = function()
databap.consts.chanPrefix = 'chan_';
databap.consts.chanQuitPrefix = 'quit_chan_';
databap.consts.chanUnreadPrefix = 'unread_chan_';
//Page variables
self.tmp('sending_msg', 'boolean');
self.tmp('refresh', 'boolean');
@@ -90,47 +90,50 @@ databap.pageInit = function()
self.tmp('last_message_id', '0');
self.tmp('scrolling', 'boolean');
databap.tmp('tab_info', 'object');
//Main elements
$MsgInput = databap.getMainElem('#message');
$MsgInputBox = databap.getMainElem('#chat_input');
//Bind message box key events
databap.getMainElem('#chat_form').submit(function(e){e.preventDefault();});
$MsgInput.bind('keydown', function(e){if(e.which == 9)e.preventDefault();});
$MsgInput.keyup(function(e){keyController(e);});
//Loading the chat
self.initScrollBar('#chat_container', '#chat_messages_box', '#chat_messages');
//Loading Chans
setChanButton();
databap.vars.chans_list[databap.consts.all_chan_id] = databap.consts.all_chan_text;
databap.tmp(['unread_msg', databap.consts.all_chan_text], 0);
joinChan(databap.consts.default_chan, true);
//window focus
$(window).focus(onPageFocus);
$(window).blur(onPageBlur);
//Message Input Focus
$MsgInput.focus();
//Init sidebar events
initSideBar();
//Setup Image upload
initImageUpload();
//Init's end
databap.setInitEnd(true);
//Notification Permission
if(!Push.Permission.has()) Push.Permission.request(()=>{}, ()=>{});
};
//On resize
databap.onResize = function()
{
self.setScrollBarSize('maximize');
//Message Input
//$('#message').width($('#chat_input').width() - $('#message_img').outerWidth(true)- 1);
};
@@ -152,7 +155,7 @@ databap.onKeyDown = function(e)
};
function initImageUpload()
{
{
//Load Uploader
self.tmp('uploader', new qq.FileUploader
(
@@ -161,13 +164,13 @@ function initImageUpload()
action: databap.getActionLink('upload_image'),
allowedExtensions: databap.consts.authorized_img_exts,
sizeLimit: parseInt(databap.consts.max_size)*100,
template: '<div class="uploader_box">' +
template: '<div class="uploader_box">' +
'<div class="uploader_droparea round">' +
'<span>Glisser les images ici</span>' +
'</div>' +
'<a class="uploader_button hide"></a>' +
'<div class="uploader_buffer hide"></div>' +
'<ul id="uploader_list" class="uploader_list hide"></ul>' +
'<ul id="uploader_list" class="uploader_list hide"></ul>' +
'</div>',
onComplete:function(id, fileName, result)
{
@@ -189,17 +192,17 @@ function initImageUpload()
}
));
$('.uploader_box').append($('#message_input').children());
//Prompt file explorer
$('#upload_img').click(function(){$('#c1_file').click();});
//Clipboard handling
$(function(){$.pasteimage(function(sSource)
{
//Parse the uri to strip out "base64"
var sSourceSplit = sSource.split("base64,");
var sSourceString = sSourceSplit[1];
//Write base64-encoded string into input field
postMessage('/imgsrc '+sSourceString);
});});
@@ -219,7 +222,7 @@ function initSideBar()
.addClass('round')
.closest('.sidebar_box').find('.sidebar_box_content')
.hide('fast');
$This
.toggleClass('round')
.closest('.sidebar_box').find('.sidebar_box_content')
@@ -268,11 +271,11 @@ function getNews()
});
}
else $('<div>', {'class':'new'}).hide().text('Aucune news.').appendTo($NewsBox);
$NewsBox.find('.loading').hide();
$NewsBox.find('.new').toggle();
$NewsBox.find('.new:hidden').remove();
//Request in 10mins
databap.tmp('news_timer', setTimeout(getNews, databap.tmp('news_period')));
},
@@ -325,7 +328,7 @@ function setChanButton()
var $This = $(this);
joinChan($This.val());
$This.val('');
}
if(typeof e.keyCode == 'undefined' || e.keyCode == 13)
{
@@ -336,7 +339,7 @@ function setChanButton()
})
.blur(function(){$(this).keyup();})
).hide()
);
);
}
function getChanKeyName(sChanName)
@@ -367,7 +370,7 @@ function joinChan(sChanName, bFirstConn, asAttendees, bSwitchOnJoin)
asAttendees = asAttendees || [];
bSwitchOnJoin = (typeof bSwitchOnJoin === 'undefined')?true:bSwitchOnJoin;
var sChanName = ucwords(sChanName);
if(sChanName!='')
{
//Join for the first time
@@ -393,10 +396,10 @@ function joinChan(sChanName, bFirstConn, asAttendees, bSwitchOnJoin)
if(!getChanName(iChanId)) addChanTab(iChanId, sReturnedChanName, data.channel_tab_names[iChanId], !bSwitchOnJoin);
}
);
//Full reload of messages
refresh_chat(true);
//Switch to the right chan
switchChan(bSwitchOnJoin?data.current_chan_id:null);
}
@@ -416,7 +419,7 @@ function joinChan(sChanName, bFirstConn, asAttendees, bSwitchOnJoin)
switchChan(bSwitchOnJoin?getChanKeyName(sChanName):null);
}
}
//Focus input bar
$('#message').focus();
}
@@ -449,26 +452,26 @@ function switchChan(sChanKeyName)
{
var sChanName = currentChan(getChanName(sChanKeyName));
sChanKeyName = sChanKeyName || getChanKeyName(sChanName);
//Unread msg
if(databap.vars.focus)
if(databap.vars.focus)
{
databap.tmp(['unread_msg', sChanName], 0);
databap.tmp(['unread_msg', databap.consts.all_chan_text], 0);
}
syncUnreadMsg();
//Switch current channel button to active
$('#chat_chan').find('span[id^="'+databap.consts.chanPrefix+'"]').removeClass('active').addClass('clickable');
$('#'+databap.consts.chanPrefix+sChanKeyName).addClass('active').removeClass('clickable');
//Show current channel messages
databap.getMainElem('#chat_messages').find('p').hide();
databap.getMainElem('#chat_messages').find('p.class_'+sChanKeyName+', p.class_'+databap.consts.all_chan_id).show();
//Update scrollbar
databap.updateScrollBar(self.tmp('scrolling')?'relative':'bottom');
//Show Current channel members
databap.getMainElem('#connected_users').find('p').hide();
databap.getMainElem('#connected_users').find('p.class_'+sChanKeyName).show();
@@ -511,7 +514,7 @@ function addChanTab(sChanKeyName, sChanName, sChanTabName, bLightUp)
sChanTabName = sChanTabName || sChanName;
databap.vars.chans_list[sChanKeyName] = sChanName;
databap.tmp(['unread_msg', sChanName], 0);
//Add channel tab
var sChanId = databap.consts.chanPrefix+sChanKeyName;
if(!$('#'+sChanId).length)
@@ -524,8 +527,8 @@ function addChanTab(sChanKeyName, sChanName, sChanTabName, bLightUp)
.append('<span class="chan_title">'+sChanTabName+'</span>')
.append('<span class="chan_unread" id="'+sChanUnreadId+'"></span>')
.append($('<a id="'+sChanQuitId+'" class="quit_chan clickable"><i class="fa fa-c-close"></i></a>').click(function(e){e.stopPropagation();quitChan($(this).attr('id').substr(databap.consts.chanQuitPrefix.length));}));
//Add channel tab name and bind delete button
$('#join_chan').before($ChanButton);
}
@@ -549,16 +552,16 @@ function quitChan(sChanKeyName)
databap.showError(textStatus);
}
);
//Delete tab
$('#'+databap.consts.chanPrefix+sChanKeyName).fadeOut('fast', function(){$(this).remove();});
//Delete from list
delete databap.vars.chans_list[sChanKeyName];
//Switch back to another chan
if(sChanName == currentChan()) switchChan(Object.keys(databap.vars.chans_list)[1]);
//Delete messages
databap.getMainElem('#chat_messages').find('p.class_'+sChanKeyName).remove();
}
@@ -614,7 +617,7 @@ function keyController(e)
else if(chat_message == '/help') displayHelp();
else if(chat_message.substr(0, 8) == '/invite ') invite($.trim(chat_message.substr(8)), currentChan());
else if(chat_message != '') bSuccess = postMessage();
if(bSuccess)
{
databap.vars.prev_chat_value = chat_message;
@@ -644,11 +647,11 @@ function keyController(e)
$This = databap.getMainElem('#message');
var sChatMsg = $This.val();
var iChatMsgLen = sChatMsg.length;
if(!e.altKey && iChatMsgLen>0)
{
var iCurPos, iFirstPos, iOffset, sWord, sWordLen, bInvite;
//Loading previous data
bLooping = !$.isEmptyObject(databap.tmp('tab_info'));
if(bLooping)
@@ -665,7 +668,7 @@ function keyController(e)
iFirstPos = sChatMsg.substr(0, iCurPos).lastIndexOf(' ') + 1;
iOffset = sChatMsg.substr(iFirstPos).indexOf(' ');
sWord = sChatMsg.substr(iFirstPos, (iOffset==-1)?iChatMsgLen:iOffset);
//@ excluded
if(sWord.substr(0, 1)=='@')
{
@@ -675,35 +678,35 @@ function keyController(e)
}
sWordLen = sWord.length;
bInvite = (sChatMsg.substr(0, 7) == '/invite');
//No guess if not at least one letter
if(sWordLen>0 || bInvite)
{
//turn to safename for matching
var sSafeWord = getSafeNickname(sWord);
var iSafeWordLen = sSafeWord.length;
//List of current channel users
var asUserList = databap.tmp(['users', bInvite?databap.consts.all_chan_id:getChanKeyName(currentChan())]);
var asSafeUserList = Object.keys(asUserList);
var iUserListLen = asSafeUserList.length;
//Starting list where we left off
var iCount = 0;
var iIndex = 0;
if(bLooping) iIndex = (Number(array_search(databap.tmp(['tab_info', 'safe_nickname']), asSafeUserList)) + 1)%iUserListLen;
if(bLooping) iIndex = (Number(array_search(databap.tmp(['tab_info', 'safe_nickname']), asSafeUserList)) + 1)%iUserListLen;
//Looping on user names to find the one(s) starting with the searched word
while(iCount < iUserListLen)
{
//Checking for first letters of user names
if(sSafeWord == asSafeUserList[iIndex].substr(0, sSafeWord.length)) break;
//Looping to the top of the list once finished
iIndex = (iIndex + 1)%iUserListLen;
iCount++;
}
if(iCount !== iUserListLen)
{
//Replace text in message input box
@@ -713,7 +716,7 @@ function keyController(e)
var sNickName = asUserList[sSafeNickName];
$This.val(sBeforeWord+sNickName+sAfterWord);
$This.setCursorPosition((sBeforeWord+sNickName).length);
//Save value for tab-loops
if(bLooping) databap.tmp(['tab_info', 'safe_nickname'], sSafeNickName); //not saving index in case of user list refresh
else databap.tmp(['tab_info'], {'chat_msg':sChatMsg, 'cur_pos':iCurPos, 'first_pos':iFirstPos, 'word':sWord, 'safe_nickname':sSafeNickName});
@@ -734,7 +737,7 @@ function keyController(e)
{
$this.width(100);
}
else if(iInputSize > maxSize)
else if(iInputSize > maxSize)
{
$this.width(maxSize);
}
@@ -771,7 +774,7 @@ function refresh_chat(bReset)
{
//Update last read message id
self.tmp('last_message_id', Math.max(result.last_message_id, prevLastMsgId));
//Display messages
$.each
(
@@ -781,14 +784,14 @@ function refresh_chat(bReset)
addMessage(message_info, bReset);
}
);
//Image display
setImageDisplay();
//News
if(databap.tmp('get_news') === true && !bReset) getNews();
databap.tmp('get_news', false);
//Nicknames changes
if(updateUsersList === true || bReset)
{
@@ -818,22 +821,25 @@ function refresh_chat(bReset)
function addMessage(message_info, bReset)
{
message_info.nickname = message_info.nickname || '';
var sChanKeyName = message_info.id_chan;
var sMsgPrefix = '<a class="user clickable" title="Ecrire un PM &agrave; '+message_info.nickname+'">'+message_info.nickname+'</a><span class="console">&gt;</span>';
var msg_body = '';
var sUnreadChanName, iUnreadCount;
var bSystemMsg = false;
var bImage = false;
var sNotif = '';
switch(message_info.msg_class)
{
case databap.consts.msg_types.user:
msg_body = sMsgPrefix+'<span class="text">'+message_info.message+'</span>';
sNotif = message_info.nickname+' : '+message_info.message;
break;
case databap.consts.msg_types.news:
databap.tmp('get_news', true);
msg_body = '<span class="text action">'+message_info.nickname+' a une news : <span class="news"><i class="fa fa-30 fa-c-news"></i> '+message_info.message+' <i class="fa fa-30 fa-c-news"></i></span></span>';
sNotif = message_info.nickname+' a une news : '+message_info.message;
break;
case databap.consts.msg_types.add.code:
var url = databap.getInternalLink('code', message_info.message);
@@ -859,6 +865,7 @@ function addMessage(message_info, bReset)
msgTargetUser = message_info.message.substr(1, slicePos - 1);
var msg = message_info.message.slice(slicePos + 1);
msg_body = '<a class="user clickable" title="Ecrire un PM &agrave; '+message_info.nickname+'">'+message_info.nickname+'</a><span class="console"> <span class="highlight">&#64;'+msgTargetUser+'</span>&gt;</span><span class="text">'+msg+'</span>';
sNotif = message_info.nickname+' @'+msgTargetUser+' : '+msg;
break;
case databap.consts.msg_types.nick:
msg_body = '<span class="text">'+message_info.message+' (<a href="'+databap.getInternalLink('profil', message_info.id_user)+'" target="_blank"><i class="fa fa-c-profile fa-inline"></i>'+message_info.name+'</a>)</span>';
@@ -875,6 +882,7 @@ function addMessage(message_info, bReset)
var msg = '<a href="'+message_info.message.url+'" target="_blank" title="'+message_info.message.title+'"><img src="'+message_info.message.url_img+'" width="'+message_info.message.width+'" height="'+message_info.message.height+'" class="proxy" /></a>';
msg_body = sMsgPrefix+'<span class="text">'+msg+'</span>';
bImage = true;
sNotif = message_info.nickname+' a posté une image';
break;
case databap.consts.msg_types.reboot:
if(!bReset)
@@ -915,7 +923,7 @@ function addMessage(message_info, bReset)
msg_body = '<span class="text">'+message_info.nickname+' a modifi&eacute; la table <a href="'+url+'" target="_blank"><i class="fa fa-c-table fa-inline"></i>'+message_info.description+'</a></span>';
break;
}
if(msg_body != '')
{
//Hide image button
@@ -929,7 +937,7 @@ function addMessage(message_info, bReset)
$Banner.find('.banner_title').width(message_info.message.width - 31);
$Msg.find('a').addClass('img_box').append($Banner);
}
//Adding message to channel panel
$Message = $('<p>', {'class':message_info.msg_class+' class_'+sChanKeyName+' hide round_right'})
.append($('<span>', {'class':'time'}).text(((message_info.date==databap.consts.cur_date)?'':message_info.date+' - ')+message_info.time))
@@ -937,15 +945,28 @@ function addMessage(message_info, bReset)
$Message.find('.chan_link').click(function(){joinChan($(this).find('.chan_text').text());});
$Message.find('.user').click(setPm);
databap.getMainElem('#chat_messages').append($Message);
//Unread messages
if(!bReset && !bSystemMsg /* && message_info.id_user!=databap.vars.user_id */)
{
sUnreadChanName = getChanName(message_info.id_chan);
iUnreadCount = (databap.tmp(['unread_msg', sUnreadChanName]) || 0) + 1;
databap.tmp(['unread_msg', sUnreadChanName], iUnreadCount);
//Desktop Notification
if(!databap.vars.focus && sNotif != '' && Push.Permission.has()) {
Push.create('Databap - '+message_info.nickname, {
body: sNotif,
icon: databap.consts.app_image_folder+(databap.tmp(['logos', message_info.id_user]) || 'logo_25.png'),
timeout: 4000,
onClick: function () {
window.focus();
this.close();
}
});
}
}
//Move to bottom if user is typing
if(message_info.id_user===databap.vars.user_id) self.tmp('scrolling', false);
}
@@ -963,7 +984,7 @@ function setImageDisplay()
$Images.find('.banner .fa').toggleClass('fa-c-image', !self.vars2('opt_chat_images'));
$Images.find('.banner .fa').toggleClass('fa-c-close', self.vars2('opt_chat_images'));
$Images.find('.banner .button').attr('title', (self.vars2('opt_chat_images')?'Cacher':'Afficher')+' les images');
databap.updateScrollBar('bottom');
}
@@ -982,7 +1003,7 @@ function refresh_users()
databap.getMainElem('#connected_users').empty();
databap.tmp('users', {});
databap.tmp('id_users', {});
$.each
(
result,
@@ -1000,7 +1021,8 @@ function refresh_users()
databap.tmp(['users', sChankeyName, sSafeNickName], sNickName);
databap.tmp(['users', databap.consts.all_chan_id, sSafeNickName], sNickName);
databap.tmp(['id_users', sNickName], user_info.id_user);
databap.tmp(['logos', user_info.id_user], user_info.logo);
//Append name to user list box
var sProfileLink = databap.getInternalLink('profil', user_info.id_user);
var sMission = user_info.status || '';
@@ -1034,7 +1056,7 @@ function refresh_users()
function getSafeNickname(sNickName)
{
return sNickName.stripVowelAccent().toLowerCase();
return sNickName.stripVowelAccent().toLowerCase();
}
function setPm()
@@ -1059,14 +1081,14 @@ function displayHelp()
{
//Get template
$Help = $('#help').clone().attr('id', 'help_'+Math.floor((Math.random()*1000)));
//Visible on all channels
$Help.find('p').addClass('class_'+databap.consts.all_chan_id);
$Help.appendTo('#chat_messages').slideDown('fast', function()
{
databap.updateScrollBar('bottom');
});
//Close button activation
$Help.find('#close_help').click(function()
{
@@ -1076,4 +1098,4 @@ function displayHelp()
});
});
}
</script>
</script>