public-offering
/
pad.pub0.org
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

lint: chat (#4573) 

Co-authored-by: Richard Hansen <rhansen@rhansen.org>
pull/4613/head
John McLear 2020-12-15 19:15:27 +00:00 committed by Richard Hansen
parent 8bf463fb00
commit 996a2d86dd
1 changed files with 48 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
src/static/js/chat.js
View File

@ -1,3 +1,4 @@
'use strict';
/**
* Copyright 2009 Google Inc., 2011 Peter 'Pita' Martischka (Primary Technology Ltd)
*
@ -20,33 +21,32 @@ const Tinycon = require('tinycon/tinycon');
const hooks = require('./pluginfw/hooks');
const padeditor = require('./pad_editor').padeditor;
var chat = (function () {
exports.chat = (() => {
let isStuck = false;
let userAndChat = false;
const gotInitialMessages = false;
const historyPointer = 0;
let chatMentions = 0;
var self = {
return {
show() {
$('#chaticon').removeClass('visible');
$('#chatbox').addClass('visible');
self.scrollDown(true);
this.scrollDown(true);
chatMentions = 0;
Tinycon.setBubble(0);
$('.chat-gritter-msg').each(function () {
$.gritter.remove(this.id);
});
},
focus() {
focus: () => {
setTimeout(() => {
$('#chatinput').focus();
}, 100);
},
stickToScreen(fromInitialCall) { // Make chat stick to right hand side of screen
// Make chat stick to right hand side of screen
stickToScreen(fromInitialCall) {
if (pad.settings.hideChat) {
return;
}
chat.show();
this.show();
isStuck = (!isStuck || fromInitialCall);
$('#chatbox').hide();
// Add timeout to disable the chatbox animations
@ -61,7 +61,7 @@ var chat = (function () {
chatAndUsers(fromInitialCall) {
const toEnable = $('#options-chatandusers').is(':checked');
if (toEnable || !userAndChat || fromInitialCall) {
chat.stickToScreen(true);
this.stickToScreen(true);
$('#options-stickychat').prop('checked', true);
$('#options-chatandusers').prop('checked', true);
$('#options-stickychat').prop('disabled', 'disabled');
@ -71,13 +71,14 @@ var chat = (function () {
userAndChat = false;
}
padcookie.setPref('chatAndUsers', userAndChat);
$('#users, .sticky-container').toggleClass('chatAndUsers popup-show stickyUsers', userAndChat);
$('#users, .sticky-container')
.toggleClass('chatAndUsers popup-show stickyUsers', userAndChat);
$('#chatbox').toggleClass('chatAndUsersChat', userAndChat);
},
hide() {
// decide on hide logic based on chat window being maximized or not
if ($('#options-stickychat').prop('checked')) {
chat.stickToScreen();
this.stickToScreen();
$('#options-stickychat').prop('checked', false);
} else {
$('#chatcounter').text('0');
@ -87,17 +88,20 @@ var chat = (function () {
},
scrollDown(force) {
if ($('#chatbox').hasClass('visible')) {
if (force || !self.lastMessage || !self.lastMessage.position() || self.lastMessage.position().top < ($('#chattext').outerHeight() + 20)) {
// if we use a slow animate here we can have a race condition when a users focus can not be moved away
// from the last message recieved.
$('#chattext').animate({scrollTop: $('#chattext')[0].scrollHeight}, {duration: 400, queue: false});
self.lastMessage = $('#chattext > p').eq(-1);
if (force || !this.lastMessage || !this.lastMessage.position() ||
this.lastMessage.position().top < ($('#chattext').outerHeight() + 20)) {
// if we use a slow animate here we can have a race condition
// when a users focus can not be moved away from the last message recieved.
$('#chattext').animate(
{scrollTop: $('#chattext')[0].scrollHeight},
{duration: 400, queue: false});
this.lastMessage = $('#chattext > p').eq(-1);
}
}
},
send() {
const text = $('#chatinput').val();
if (text.replace(/\s+/, '').length == 0) return;
if (text.replace(/\s+/, '').length === 0) return;
this._pad.collabClient.sendMessage({type: 'CHAT_MESSAGE', text});
$('#chatinput').val('');
},
@ -108,8 +112,8 @@ var chat = (function () {
// create the time string
let minutes = `${new Date(msg.time).getMinutes()}`;
let hours = `${new Date(msg.time).getHours()}`;
if (minutes.length == 1) minutes = `0${minutes}`;
if (hours.length == 1) hours = `0${hours}`;
if (minutes.length === 1) minutes = `0${minutes}`;
if (hours.length === 1) hours = `0${hours}`;
const timeStr = `${hours}:${minutes}`;
// create the authorclass
@ -120,17 +124,20 @@ var chat = (function () {
* let's be defensive and replace it with "unknown".
*/
msg.userId = 'unknown';
console.warn('The "userId" field of a chat message coming from the server was not present. Replacing with "unknown". This may be a bug or a database corruption.');
console.warn(
'The "userId" field of a chat message coming from the server was not present. ' +
'Replacing with "unknown". This may be a bug or a database corruption.');
}
const authorClass = `author-${msg.userId.replace(/[^a-y0-9]/g, (c) => {
if (c == '.') return '-';
if (c === '.') return '-';
return `z${c.charCodeAt(0)}z`;
})}`;
const text = padutils.escapeHtmlWithClickableLinks(msg.text, '_blank');
const authorName = msg.userName == null ? _('pad.userlist.unnamed') : padutils.escapeHtml(msg.userName);
const authorName = msg.userName == null ? html10n.get('pad.userlist.unnamed')
: padutils.escapeHtml(msg.userName);
// the hook args
const ctx = {
@ -151,9 +158,11 @@ var chat = (function () {
// does this message contain this user's name? (is the curretn user mentioned?)
const myName = $('#myusernameedit').val();
const wasMentioned = (text.toLowerCase().indexOf(myName.toLowerCase()) !== -1 && myName != 'undefined');
const wasMentioned =
text.toLowerCase().indexOf(myName.toLowerCase()) !== -1 && myName !== 'undefined';
if (wasMentioned && !alreadyFocused && !isHistoryAdd && !chatOpen) { // If the user was mentioned, make the message sticky
// If the user was mentioned, make the message sticky
if (wasMentioned && !alreadyFocused && !isHistoryAdd && !chatOpen) {
chatMentions++;
Tinycon.setBubble(chatMentions);
ctx.sticky = true;
@ -161,7 +170,9 @@ var chat = (function () {
// Call chat message hook
hooks.aCallAll('chatNewMessage', ctx, () => {
const html = `<p data-authorId='${msg.userId}' class='${authorClass}'><b>${authorName}:</b><span class='time ${authorClass}'>${ctx.timeStr}</span> ${ctx.text}</p>`;
const html =
`<p data-authorId='${msg.userId}' class='${authorClass}'><b>${authorName}:</b>` +
`<span class='time ${authorClass}'>${ctx.timeStr}</span> ${ctx.text}</p>`;
if (isHistoryAdd) $(html).insertAfter('#chatloadmessagesbutton');
else $('#chattext').append(html);
@ -192,14 +203,14 @@ var chat = (function () {
chatMentions = 0;
Tinycon.setBubble(0);
});
if (!isHistoryAdd) self.scrollDown();
if (!isHistoryAdd) this.scrollDown();
},
init(pad) {
this._pad = pad;
$('#chatinput').on('keydown', (evt) => {
// If the event is Alt C or Escape & we're already in the chat menu
// Send the users focus back to the pad
if ((evt.altKey == true && evt.which === 67) || evt.which === 27) {
if ((evt.altKey === true && evt.which === 67) || evt.which === 27) {
// If we're in chat already..
$(':focus').blur(); // required to do not try to remove!
padeditor.ace.focus(); // Sends focus back to pad
@ -208,11 +219,12 @@ var chat = (function () {
}
});
const self = this;
$('body:not(#chatinput)').on('keypress', function (evt) {
if (evt.altKey && evt.which == 67) {
if (evt.altKey && evt.which === 67) {
// Alt c focuses on the Chat window
$(this).blur();
chat.show();
self.show();
$('#chatinput').focus();
evt.preventDefault();
}
@ -220,9 +232,9 @@ var chat = (function () {
$('#chatinput').keypress((evt) => {
// if the user typed enter, fire the send
if (evt.which == 13 || evt.which == 10) {
if (evt.which === 13 || evt.which === 10) {
evt.preventDefault();
self.send();
this.send();
}
});
@ -230,22 +242,17 @@ var chat = (function () {
$('#chatcounter').text(0);
$('#chatloadmessagesbutton').click(() => {
const start = Math.max(self.historyPointer - 20, 0);
const end = self.historyPointer;
const start = Math.max(this.historyPointer - 20, 0);
const end = this.historyPointer;
if (start == end) // nothing to load
{ return; }
if (start === end) return; // nothing to load
$('#chatloadmessagesbutton').css('display', 'none');
$('#chatloadmessagesball').css('display', 'block');
pad.collabClient.sendMessage({type: 'GET_CHAT_MESSAGES', start, end});
self.historyPointer = start;
this.historyPointer = start;
});
},
};
return self;
}());
exports.chat = chat;
})();