(()=>{ url_domain =(data)=> { let a = document.createElement('a'); a.href = data; return a.hostname; }; for (let script of document.getElementsByTagName('script')) { if (script.src.indexOf('messenger')>=0) { let url = script.src; window.messangerSrc = url_domain(url); break; } } })(); class ChatMessenger { asyncLoadScripts (origin) { this.loadCSS(`${origin}/messenger/css/messenger.css?cache=` + Date.now()); this.loadCSS(`//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css`); console.log('origin', `${origin}js/mediasoup3/easy-mediasoup.bundle.min.js`); let files = [ `//cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.slim.js`, '//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js', '//cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js', `${origin}js/mediasoup3/easy-mediasoup.bundle.min.js`, `${origin}js/mediasoup3/mediasSoup3.js`, `https://cdn.jsdelivr.net/npm/lsx-emojipicker@1.1.2/jquery.lsxemojipicker.min.js`, `https://cdn.jsdelivr.net/npm/hark@1.2.3/hark.bundle.js` ]; if(!window.jQuery) { files.unshift('//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js'); } let checkStateAndCall = (path, callback) => { let _success = false; return function () { if (!_success && (!this.readyState || (this.readyState === 'complete'))) { _success = true; callback(); } }; }; let loadNext = () => { // chain element if (!files.length) { this.init(); return; } let path = files.shift(); let scriptElm = document.createElement('script'); scriptElm.type = 'text/javascript'; scriptElm.async = true; scriptElm.src = path; scriptElm.onload = scriptElm.onreadystatechange = checkStateAndCall(path, loadNext); // load next file in chain when let headElm = document.head || document.getElementsByTagName('head')[0]; headElm.appendChild(scriptElm); }; loadNext(); // start a chain }; ago(date) { let plurial; let seconds = Math.floor((new Date() - date) / 1000); let interval = Math.floor(seconds / 31536000); if (interval > 0) { if (interval>1) { return eval(this.traductions.yearsAgo); } else { return eval(this.traductions.yearAgo); } } interval = Math.floor(seconds / 2592000); if (interval > 0) { if (interval>1) { return eval(this.traductions.monthsAgo); } else { return eval(this.traductions.monthAgo); } } interval = Math.floor(seconds / 86400); if (interval > 0) { if (interval>1) { return eval(this.traductions.daysAgo); } else { return eval(this.traductions.dayAgo); } } interval = Math.floor(seconds / 3600); if (interval > 0) { if (interval>1) { return eval(this.traductions.hoursAgo); } else { return eval(this.traductions.hourAgo); } } interval = Math.floor(seconds / 60); if (interval > 0) { if (interval>1) { return eval(this.traductions.minutesAgo); } else { return eval(this.traductions.minuteAgo); } } return 'now'; }; isEmpty (obj){ return Object.keys(obj).length === 0 && obj.constructor === Object; }; getDateAgo (date) { let res = new Date(date).getTime(); return ago(res); }; loadCSS (src) { let head = document.getElementsByTagName('HEAD')[0]; let link = document.createElement('link'); link.rel = 'stylesheet'; link.type = 'text/css'; link.href = src; head.appendChild(link); }; async getWebmasterid (url) { let res = await $.ajax({ url: this.ajax, type: 'POST', data: {a:'getWebmasterid', url:url} }); return parseInt(res); }; constructor(myUser = {}, notification = {}, callBackAddUser = false, callBackRemoveUser = false, traductions={}) { this.traductions = { yourMessage: "Your message", minuteAgo: "`${interval} min ago.`", minutesAgo: "`${interval} mins ago.`", hourAgo: "`${interval} hour ago.`", hoursAgo: "`${interval} hours ago.`", dayAgo: "`${interval} day ago.`", daysAgo: "`${interval} days ago.`", monthAgo: "`${interval} month ago.`", monthsAgo: "`${interval} months ago.`", yearAgo: "`${interval} year ago.`", yearsAgo: "`${interval} years ago.`", }; this.traductions = { ...traductions, ...this.traductions}; if (!window.messangerSrc) { window.messangerSrc = 'html5-chat.com'; } let origin = `//${window.messangerSrc}/`; if (myUser.ajax) { this.ajax = myUser.ajax; } else { this.ajax = origin + 'ajax.php'; } if (!myUser.el) { myUser.el = 'button[data-userid], div[data-userid]'; } if (!myUser.imagePath) { myUser.imagePath = ''; } this.myUser = myUser; this.users = new Map(); this.mutedUsers = new Map(); this.container = 'messengerContainer'; this.notification = notification; this.callBackAddUser = callBackAddUser; this.callBackRemoveUser = callBackRemoveUser; this.socket = {}; this.asyncLoadScripts(origin); }; pickRandomAvatar () { let rnd = Math.round(Math.random()*10) + 1; return `https://html5-chat.com/img/avatars/${rnd}.svg`; }; async getConfig (webmasterid) { let res = await $.ajax({ url: this.ajax, type: 'POST', data: {a:'getConfig', webmasterid:webmasterid} }); return JSON.parse(res); }; async getDefaultRoom (webmasterid) { let res = await $.ajax({ url: this.ajax, type: 'POST', data: {a:'getDefaultRoom', webmasterid:webmasterid} }); return JSON.parse(res); }; getMuted () { $.post(this.ajax, {a:'getMutedUsersAsArray', webmasterid:this.myUser.webmasterid, userid:this.myUser.id}, (jsonMuted)=> { if (jsonMuted) { jsonMuted = JSON.parse(jsonMuted); jsonMuted.forEach((muted) => { this.mutedUsers.set(muted.muteduserid, muted); let temp = `#messengerNotificatorContent div.messengerNotificatorUserItem[data-userid=${muted.muteduserid}]`; $(temp).addClass('muted'); }); } this.restoreWindows(); }); }; getUsersWhoSentMeMessages () { this.socket.emit('getUsersWhoSentMeMessages', (messages)=>{ if (!messages) return; messages = JSON.parse(messages); messages.forEach((message) => { let extra = JSON.parse(message.extras); let id = parseInt(message.fromid); let status = (this.users.get(id))?'messengerOnline':'messengerOffline'; let user = {id: id, username:extra.from, avatar:extra.avatar, status:status}; this.addUser(user); }); }); }; async promptForUsername (){ return new Promise((resolve)=>{ let template = `
`; jQuery('#messengerContainer').append(template); jQuery(document).on('keyup', '#messengerInput', (e) => { e.preventDefault(); e.stopImmediatePropagation(); let keyCode = e.keyCode || e.which; if (keyCode===13) { let username = jQuery(e.currentTarget).val(); if (username) { jQuery('#modalMessenger').remove(); resolve(username); } } }); }); }; filterUsers (username = '') { let filterOnline = $('#filterOnlineUsers').hasClass('onlineFilter'); jQuery('#messengerNotificatorContent .messengerNotificatorUserItem').show(); if (filterOnline) { let $els = $('div.messengerStatus.messengerOffline'); $els.each((index, element)=> { $(element).parent().hide(); }); } if (!username) return; let temp = `#messengerNotificatorContent .messengerNotificatorUserItem:not([data-username*='${username}'])`; jQuery(temp).hide(); console.log('filterOnline', filterOnline); }; addMessengerNotificator (){ let template = `
${this.traductions.users}
`; jQuery('#' + this.container).append(template); let $messengerNotificatorHeader = jQuery('#messengerNotificatorHeader'); $messengerNotificatorHeader.on('mouseup', ()=> { $('#messengerNotificator').toggleClass('messengerNotificatorMinimized'); }); jQuery('#messengerClearSearch').on('mouseup', ()=> { $('#messengerNotificatorSearch').val(''); this.filterUsers(); }); jQuery('#messengerNotificatorSearch').on('keyup', (e)=>{ e.preventDefault(); e.stopImmediatePropagation(); let search = jQuery(e.currentTarget).val(); this.filterUsers(search); }); jQuery('#filterOnlineUsers').on('mouseup', (e)=> { e.preventDefault(); e.stopImmediatePropagation(); jQuery(e.currentTarget).toggleClass('onlineFilter'); let search = jQuery(e.currentTarget).val(); this.filterUsers(search); }); jQuery('#messengerExit').on('mouseup', (e)=>{ localStorage.removeItem('user'); jQuery.each(localStorage, (key, data)=>{ if (typeof key === 'string' && key.indexOf('messenger_')===0) { localStorage.removeItem(key); } }); window.location = this.config.quitUrl; }); }; async init () { let el = `
`; if (!jQuery(`#${this.container}`).length) { jQuery('body').append(el); } if (this.isEmpty(this.notification)) { this.addMessengerNotificator(); } let localUser = localStorage.getItem('user') ? JSON.parse(localStorage.getItem('user')) : false; if (!this.myUser.avatar) { this.myUser.avatar = this.pickRandomAvatar(); } if (!this.myUser.username) { this.myUser.username = (localUser && localUser.username) ? localUser.username : await this.promptForUsername(); } if (!this.myUser.id) { this.myUser.id = (localUser && localUser.id)? localUser.id :Date.now(); } this.myUser.streamid = Date.now(); localStorage.setItem('user', JSON.stringify(this.myUser)); if (!this.myUser.webmasterid) { this.myUser.webmasterid = (localUser && localUser.webmasterid) ? localUser.webmasterid : await this.getWebmasterid(window.messangerSrc); } localStorage.setItem('user', JSON.stringify(this.myUser)); console.log('init..', this.myUser); jQuery('button[data-userid]').addClass('messengerOffline'); this.initEvents(); setInterval(()=>{ jQuery('#messengerContainer div.content div.messages span.timeAgo').each((index, element)=> { let date = jQuery(element).data('ago'); let ago = this.ago(date); jQuery(element).text(ago); }); }, 60000); this.config = await this.getConfig(this.myUser.webmasterid); this.myUser.room = await this.getDefaultRoom(this.myUser.webmasterid); this.connectToServer(); this.getMuted(); }; getChat(userid){ return jQuery(`#messengerContainer div.content[data-userid=${userid}]`); }; updateElements (user) { //console.log('updateElements', user); jQuery(`button[data-userid=${user.id}]`).removeClass('messengerOffline').removeClass('messengerOnline').addClass(user.status); jQuery(`#messengerContainer div.header`).removeClass('messengerOffline').removeClass('messengerOnline').addClass(user.status); }; updateUsersNumber () { jQuery('#messengerNotificatorCounter').text(this.users.size); }; connectToServer () { if (this.myUser.username.length>50) { return; } this.socket = io.connect(this.config.nodeMessenger, { 'force new connection': true, transports: ['websocket'], secure: true, query: this.myUser }); this.socket.on('connected', ()=> { console.log('Connected to server !'); this.socket.emit('enterRoom', this.myUser); //connectMS(this.config.webrtcServerUrl, this.myUser.id, this.config.VIDEO_CONSTRAINTS); this.updateNotification(); }); this.socket.on('call1to1', (user)=> { if (this.mutedUsers.has(user.id)) { return; } let $chat = this.getChat(user.id); let message = `${user.username} requested a video call.`; this.serverMessage($chat, message, 'serverMessage'); if (this.myUser.call1to1User) { return; } user.isCaller = true; this.myUser.call1to1User = user; this.displayCall1to1(user); }); this.socket.on('call1to1Cancelled', (user)=> { this.closeMyWebcam(); console.log(user); }); this.socket.on('call1to1Accepted', (user)=> { jQuery('div.messengerWebcamContainer div#MessengerPhotoCallerContainer').hide(); playStream(user.streamid, '#hisMessengerVideo'); jQuery('#hisMessengerVideo').show(); jQuery('#messengerMuteAudioBtn').removeClass('hiddenButton'); jQuery('#messengerToggleWebcamBtn').addClass('hiddenButton'); }); this.socket.on('getUsers', (usersInRoom)=> { //console.log('getUsers', usersInRoom); for (let userid in usersInRoom) { let user = usersInRoom[userid]; user.status = 'messengerOnline'; this.addUser(user); if (this.callBackAddUser) { this.callBackAddUser(user); } user.status = 'messengerOnline'; this.updateElements(user); } this.getUsersWhoSentMeMessages(); }); this.socket.on('receiveMessenger', (fromUser, toUser, message, extras)=> { if (this.mutedUsers.has(parseInt(fromUser.id))) { return; } this.appendMessage(fromUser, toUser, message, extras); this.playMP3(this.config.soundPrivateMessageReceived); }); this.socket.on('messengerWrites', (user)=> { let $e = jQuery(`#messengerContainer div.content[data-userid=${user.id}] span.isWrtiting`); if (!$e.hasClass('writesBlink')) { $e.addClass('writesBlink'); setTimeout(()=> { $e.removeClass('writesBlink'); }, 4500); } }); this.socket.on('addUser', (user)=> { if (this.callBackAddUser) { this.callBackAddUser(user); } user.status = 'messengerOnline'; this.updateElements(user); this.addUser(user); }); this.socket.on('removeUser', (user)=> { user.status = 'messengerOffline'; this.updateElements(user); if (this.callBackRemoveUser) { this.callBackRemoveUser(user); } this.removeUser(user); if (this.myUser.call1to1User && this.myUser.call1to1User.id === user.id) { this.closeMyWebcam(); } }); }; removeUser (user) { let el = `#messengerNotificatorContent div.messengerNotificatorUserItem[data-userid=${user.id}] div.messengerStatus`; jQuery(el).removeClass('messengerOnline').removeClass('messengerOffline').addClass('messengerOffline'); this.updateUsersNumber(); this.users.delete(parseInt(user.id)); }; addRandomUsers (num = 50) { for(let i=0;i `; if (user.gender && user.gender!=='undefined' && jQuery(`#genderChecboxContainer${user.gender}`).length===0) { jQuery('#genderFilterDiv').append(genderEl); } let eluser = `#messengerNotificatorContent div.messengerNotificatorUserItem[data-userid=${user.id}]`; $(eluser).remove(); let $messengerNotificatorContent = jQuery('#messengerNotificatorContent'); if (!$messengerNotificatorContent.length) return; let title = (this.myUser.id===user.id)?"That's you !" : user.username; let profileEl = (user.profile)?``:''; let gender = (user.gender)?user.gender:''; let el = `
${user.username}
${profileEl}
`; $messengerNotificatorContent.prepend(el); this.users.set(parseInt(user.id), user); this.updateUsersNumber(); this.updateFilterGenders(); }; messengerWindowDelete (userid) { localStorage.removeItem(`messenger_${userid}`); }; messengerWindowSave (user) { let $chat = this.getChat(user.id); let top = $chat.css('top'); let left = $chat.css('left'); let data = {username:user.username, left:left, top:top, avatar:user.avatar}; localStorage.setItem(`messenger_${user.id}`, JSON.stringify(data)); }; messengerWindowRestore (user) { let data = localStorage.getItem(`messenger_${user.id}`); if (data) { data = JSON.parse(data); let $chat = this.displayChat(user); $chat.css('left', data.left); $chat.css('top', data.top); } }; restoreWindows () { jQuery.each(localStorage, (key, data)=>{ if (typeof key === 'string') { let arr = key.split('messenger_'); if (arr.length > 1) { try { data = JSON.parse(data); let user = {id: arr[1], username: data.username, avatar:data.avatar}; this.messengerWindowRestore(user); } catch(e) { } } } }); }; sendMessenger (message, toUser, extras={}) { extras.time = Date.now(); extras.from = this.myUser.username; extras.avatar = this.myUser.avatar; this.socket.emit('sendMessenger', this.myUser, toUser, message, extras); }; call1to1HangOut () { this.socket.emit('call1to1Cancelled', this.myUser.call1to1User.id); this.closeMyWebcam(); }; closeMyWebcam () { unpublishOwnFeed('#myMessengerVideo'); jQuery('.messengerWebcamContainer').remove(); delete ChatHTML5.myUser.call1to1User; }; displayCall1to1 (userWhoCalls) { let classeWebcamBtn = (parseInt(this.myUser.id) === parseInt(userWhoCalls.id))?'hiddenButton':''; let template = `
${this.myUser.call1to1User.username}
${this.myUser.call1to1User.username}
`; jQuery('#messengerContainer').append(template); }; updateNotification () { this.socket.emit('getCountMessengerUnread', (messageCount)=>{ if (!messageCount) { messageCount = ''; } let html = `
${messageCount}
`; jQuery(this.notification.id).html(html); }); }; selectChat (user) { let $chat = this.getChat(user.id); if (!$chat.length) { $chat = this.displayChat(user); } else { $chat.find('input').focus(); } return $chat; }; serverMessage ($chat, message, classe='serverMessage'){ let now = Date.now(); let ago = this.ago(now); let el = `
${ago}
${message}
`; let $messages = $chat.find('.messages'); $messages.append(el); let objDiv = $messages[0]; if (objDiv) { objDiv.scrollTop = objDiv.scrollHeight; } }; appendMessage (fromUser, toUser, message, extras='') { //console.log('appendMessage', fromUser, toUser, message, extras); let classe = 'messageOther'; let $chat; if (fromUser.id === this.myUser.id) { $chat = this.getChat(toUser.id); classe = 'messageMine'; } else { let exists = this.getChat(fromUser.id).length; $chat = this.selectChat(fromUser); if (!exists){ return; } } if (!$chat.length) return; let ago = this.ago(extras.time); let el = `
${fromUser.username}${ago}
${message}
`; let $messages = $chat.find('.messages'); $messages.append(el); let objDiv = $messages[0]; if (objDiv) { objDiv.scrollTop = objDiv.scrollHeight; } }; updateFilterGenders() { jQuery('#genderFilterDiv input').each(function(i, el) { let genre = $(el).val(); let $checkBox = jQuery(`#genderChecbox${genre}`); if ($checkBox.prop('checked')) { $(`#messengerNotificatorContent div.${genre}`).show(); } else { $(`#messengerNotificatorContent div.${genre}`).hide(); } }); } displayChat (user) { user.id = parseInt(user.id); let headerClass = (this.users.get(user.id) && this.users.get(user.id).status ==='messengerOnline') ?'messengerOnline':'messengerOffline'; let mutedClass = (this.mutedUsers.get(user.id)) ?'muted':''; let username = (user.profile!=="undefined")?`${user.username}`:user.username; let template = `
${user.username} ${username} is writing
`; jQuery('#messengerContainer').append(template); jQuery(`div[data-userid=${user.id}]`).draggable({ containment: 'parent', stack: 'div', handle: 'div.header', stop: ( e, ui )=> { console.log(ui.position.left, ui.position.top); this.messengerWindowSave(user); } }); let $chat = this.getChat(user.id); this.messengerWindowSave(user); $chat.find('input').focus(); $chat.find('.messengerEmojiBtn').lsxEmojiPicker({ onSelect:(emoji)=>{ let input = $(event.currentTarget).parents('form.footer').find('input')[0]; const value = input.value; const start = input.selectionStart; const end = input.selectionEnd; let textToInsert = emoji.value.replace('&#','0'); input.value = value.slice(0, start) + String.fromCodePoint(textToInsert) + value.slice(end); // update cursor to be at the end of insertion input.selectionStart = input.selectionEnd = start + textToInsert.length; input.focus(); } }); // get History if (this.mutedUsers.has(parseInt(user.id))) { return false; } this.socket.emit('getMessengerMessages', user.id, (messages)=>{ messages = JSON.parse(messages); messages = messages.reverse(); messages.forEach((message) => { let extras = JSON.parse(message.extras); if (parseInt(message.fromid) === parseInt(this.myUser.id)) { let user = {id:message.toid, username:extras.from, avatar:extras.avatar}; this.appendMessage(this.myUser, user, message.message, extras); } else { let user = {id:message.fromid, username:extras.from, avatar:extras.avatar}; this.appendMessage(user, this.myUser, message.message, extras); } }) }); this.updateNotification(); return $chat; }; displayMenuMessages (messages) { if (!messages.length){ return; } let menuItems = ''; messages.forEach((message) => { let extra = JSON.parse(message.extras); let classeBall = (this.users.get(parseInt(message.fromid)))?'online':''; let menuItem = ` `; menuItems+=menuItem; }); let el = ` `; this.removeMenu(); let $notificationElementId = jQuery(this.notification.id); $notificationElementId.remove('.menu'); $notificationElementId.append(el); }; removeMenu () { jQuery(`${this.notification.id} .menuMessenger`).remove(); }; playMP3 (mp3file, loop=false) { if (!mp3file) { return; } try { let soundMP3 = new Audio(); if (soundMP3.paused) { soundMP3.src = mp3file; soundMP3.loop = loop; try { soundMP3.play().catch(function() { }); } catch(e) { console.log('error playsound', mp3file); } } } catch(e) { console.log('error playsound', mp3file); } }; initEvents () { let $messengerContainer = jQuery('#messengerContainer'); $messengerContainer.on('mousedown', 'button.closeBtn', (e) => { e.stopImmediatePropagation(); let $chat = jQuery(e.currentTarget).closest('.content'); let userid = $chat.data('userid'); this.messengerWindowDelete(userid); $chat.remove(); }); $messengerContainer.on('mouseup', 'button.clearMessengerBtn', (e) => { let message = `Are you sure you want to clear this chat ? `; let $chat = jQuery(e.currentTarget).closest('.content'); this.serverMessage($chat, message); }); $messengerContainer.on('mouseup', 'button[data-answer]', (e) => { e.stopImmediatePropagation(); let answer = ($(e.currentTarget).data('answer')==='yes'); let $chat = jQuery(e.currentTarget).closest('.content'); $(e.currentTarget).parent().parent().remove(); if (answer) { let userid = $chat.data('userid'); console.log('userid', userid); $chat.find('div.messages').empty(); this.socket.emit('deleteMessengerMessages', userid); } }); $messengerContainer.on('mouseup', 'button.muteUserBtn', (e) => { e.stopImmediatePropagation(); $(e.currentTarget).toggleClass('muted'); let $el = jQuery(e.currentTarget).closest('[data-userid]'); let muteduserid = $el.data('userid'); let username = $el.data('username'); let val = !this.mutedUsers.has(muteduserid); this.socket.emit('messengerMute', muteduserid, val); let $chat = this.getChat(muteduserid); let message; if (val) { message = sprintf(this.traductions['userHasBeenMutedBanned'], username); this.mutedUsers.set(muteduserid, {id:muteduserid, username:username}); } else { message = sprintf(this.traductions['userHasBeenUnmutedUnbanned'], username); this.mutedUsers.delete(muteduserid); } $(`#messengerNotificatorContent div.messengerNotificatorUserItem[data-userid=${muteduserid}]`).toggleClass('muted'); this.serverMessage($chat, message); }); $messengerContainer.on('mouseup', 'button.webcamBtn', (e) => { e.stopImmediatePropagation(); let id = jQuery(e.currentTarget).closest('[data-userid]').data('userid'); let user = this.users.get(parseInt(id)); if (!user) return; user.isCaller = false; this.myUser.call1to1User = user; this.displayCall1to1(this.myUser); publishOwnFeed('#myMessengerVideo', this.myUser.streamid); }); jQuery(document).on('change', '#genderFilterDiv input', (e)=> { this.updateFilterGenders(); }); jQuery(document).on('mouseup', ()=>{ this.removeMenu(); }); jQuery(document).on('mouseup', 'div.menuMessenger .menuMessengerItem', (e)=> { e.stopImmediatePropagation(); e.stopImmediatePropagation(); let $e = jQuery(e.currentTarget); let user = {id:$e.data('id'), username:$e.data('username'), avatar:$e.data('avatar'), profile:$e.data('profile')}; this.removeMenu(); this.displayChat(user); }); jQuery(document).on('getMyStreamId', ()=> { console.log('call1to1', this.myUser.call1to1User.id); if(this.myUser.call1to1User.isCaller) { this.socket.emit('call1to1Accepted', this.myUser.call1to1User.id); } else { this.socket.emit('call1to1', this.myUser.call1to1User.id); } }); $messengerContainer.on('keyup', 'form.footer input', (e) => { e.preventDefault(); e.stopImmediatePropagation(); let keyCode = e.keyCode || e.which; if (!this.myUser.isWriting) { console.log('isWriting !!!'); this.myUser.isWriting = true; let userid = jQuery(e.constructor).find('[data-userid]').data('userid'); this.socket.emit('messengerWrites', userid); setTimeout(()=> { this.myUser.isWriting = false; }, 5000); } if (keyCode === 13) { let message = jQuery(e.currentTarget).val(); if (!message) return; jQuery(e.currentTarget).val(''); let $content = jQuery(e.currentTarget).closest('.content'); let id = $content.data('userid'); let username = $content.data('username'); let avatar = $content.data('avatar'); let user = {id:id, username:username, avatar:avatar}; this.sendMessenger(message, user); } }); jQuery(document).on('mousedown', this.myUser.el, (e) => { e.stopImmediatePropagation(); let $e = jQuery(e.currentTarget); let userid = $e.data('userid'); let username = $e.data('username'); let avatar = $e.data('avatar'); let profile = $e.data('profile'); if (parseInt(userid)===parseInt(ChatHTML5.myUser.id)) return; let user = {id:userid, username:username, avatar:avatar, profile:profile}; this.selectChat(user); }); jQuery(document).on('mouseup', 'button#messengerHangoutBtn', () => { this.call1to1HangOut(); }); jQuery(document).on('mouseup', 'button#messengerMuteAudioBtn', (e) => { let $e = jQuery(e.currentTarget); $e.toggleClass('muted'); mute('#myMessengerVideo', $e.hasClass('muted')); }); jQuery(document).on('mouseup', 'button#messengerToggleWebcamBtn', () => { //this.socket.emit('call1to1Accepted', this.myUser.call1to1User.id); publishOwnFeed('#myMessengerVideo', this.myUser.streamid); }); jQuery(document).on('getMyStreamId', ()=> { ChatHTML5.myUser.webcam = true; //ChatHTML5.cameraStatus(false); }); let $notificationElementId = jQuery(this.notification.id); if ($notificationElementId.length) { jQuery(document).on('mouseup', this.notification.id, ()=>{ this.socket.emit('getMessengerUnread', (messages)=>{ messages = JSON.parse(messages); console.log('getMessengerMessages', messages); this.displayMenuMessages(messages); }); }) } }; }var ChatHTML5 = new ChatMessenger(, {}, false, false, {"hosting":{"hosting":"Hosting","Host html5 chat":"Host html5 chat","How to host html5 chat":"How to host html5 chat ? ","Host Your chat":"You can now host the chat<\/b> on your server
We can install the media server part<\/b> (streaming) and the sockets<\/b> (chat text) on your server.
","Advantages":"What are the advantages of hosting that on your server ?","you have 100% bandwidth of your server":"You have 100% bandwidth of your server","you have 100% CPU power of your server":"You have 100% CPU power of your server","you have 100% CPU control of your server":"you have 100% CPU control of your server","You are independent":"You are independent","FAQ":"Frequently asked questions","You still got updates automatically":"You still got updates automatically since the chat is hosted on our servers except the webcam and the sockets !","You still have to pay subscription":"You still have to pay subscription since the chat script part is still hosted on our servers","Generally it takes 24-48 hours":"Generally it takes 24-48 hours so we set it up on your server","You need a dedicated server":"You need a dedicated server with ROOT access","We recommend 4 Giga RAM":"We recommend 4 Giga RAM, 4 cores and root access. It must be LINUX. We recommend DEBIAN 9 distribution (but centos\/ubuntu... are ok)","We need a ROOT access to your server":"We need a ROOT access to your server","Of course you can still use your server for other tasks":"Of course you can still use your server for other tasks like hosting your sites","Price is":"Price is 199\u20ac. It is JUST ONE time price.<\/b>","Other questions ?":"Other questions ?","Contact us by skype":"Contact us by skype.","You can purchase here":"You can purchase the hosting service here. Once payment done, we will contact you to get all servers infos like the root access.","oneTimePrice":"199 euros : ONE TIME FEE.","Unlimited webcams : really !":"Unlimited webcams : really !"},"Best webcam chat script":"Best webcam chat script","Free version has not WEBRTC and uses Flash for webcam chat.":"Free version has WEBRTC as well <\/a> but has some limited features.","Looking for 123flashchat, avchat or camfrog alternatives in HTML5\/webrtc ?":"Looking for flash alternatives (123flashchat, avchat or camfrog) in HTML5 and webrtc ?","I did not receive my email. Please send it again":"I did not receive my email. Please send it again","roomList":"Room List","privateOn":"Private on","privateOff":"Private off","camOn":"Cam on","camOff":"Cam off","soundOn":"sound On","soundOff":"sound Off","searchUsers":"Search user","online":"online","chatWithSomeone":"chat with %s","chatInRoom":"chat in %s","name":"Name","join":"Join","close":"Close","quit":"Quit","cleanChat":"Clear chat","smileys":"Smileys","userHasClosedPrivateChat":"%s closed private chat","quitChat":"Quit chat ?","login":"Enter","chooseAnUsername":"Choose a username","showMyWebcamToAnyone":"Show my webcam to anyone","myWebcamIsPublic":"Public webcam","myWebcamIsPrivate":"Private webcam","showMyWebcamOnlyOnInvitation":"Show my webcam only on invitation","changeAvatar":"Change avatar","statusOnline":"Status online","statusOffline":"Status offline","statusBusy":"Status busy","muteUser":"Mute user","private":"Private","kickUser":"Kick user out","banUser":"Ban user","ban":"Ban","chooseDurationIfTheBanInMinutes":"Choose duration of the ban (in minutes)","explainWhyYouBan":"Explain why you ban that user","forgottenPassword":"Forgotten password ?","password":"Password","usernameOrEmail":"Username or email","enterYourUsernameOrEmail":"Enter your username or email","register":"Register","username":"Username","email":"Email","confirmPassword":"Confirm your password","enterYourUsername":"Enter your username","enterYourEmail":"Enter your email","enterYourPassword":"Enter your password","createNewRoom":"Create a new room","enterNameOfRoom":"Enter the name of the room","enterWelcomeMessage":"Enter welcome message","welcome":"Welcome","publicRoom":"Public room","privateRoom":"Private room","createRoom":"Create room","rooms":"Rooms","chatters":"Chatters","enterPassword":"Enter password","passwordIncorrect":"Incorrect password","action":"Action","youHaveBeenKicked":"You have been kicked !","unreadMessages":"Unread messages","watchesMe":"is watching me","badLoginOrPassword":"Bad login or password","youHaveBeenBannedFromChat":"You have been banned from the chat for %s<\/b> minutes.
Reason:%s","youHaveBeenKickedByUser":"You have been kicked out of the chat by %s","youAreNowWatchingUser":"You are watching %s","requestAPrivateChat":"requests a private chat","accept":"Accept","deny":"Deny","mute":"Mute","requestsAVideoChat":"asks for video chat","youRequestedAPrivateChatWith":"You requested a private chat with","privateWith":"private with","youEequestedWatchWebcamOf":"You requested webcam of ","webcamNumberMaximumReached":"Maximum number of webcams reached","invalidImageType":"Invalid image type","invalidImageSize":"Invalid image size","thisEmailIsAlreadyUsed":"This email is already used","thisUsernameIsTaken":"This username is already used","youCannotUseJunkEmailService":"Junk email are forbidden","checkYourEmailToConfirm":"Check your email %s to confirm","emailWithPasswordHasBeenSent":"An email containing your password has been sent","emailNotFoundInDatabase":"No such email in our database","unmuteUser":"Unmute %s","privateWithX":"Ask private chat with %s","kickUserX":"Kick %s out","banUserX":"Ban %s","youJustKickedX":"You kicked %s out","toInviteForPrivateChatYouMustEnablePrivateChatsYourself":"To invite for private chat, you must enable privates. Enable private now ?","passwordDoNotMatch":"Password do not match","invalidEmail":"invalid email","invalidPassword":"Invalid password","invalidUsername":"Invalid username","isWriting":"is writing","home":"Home","enterChat":"Enter chat","getChat":"Get chat","purchaseChat":"Purchase chat","features":"Features","faq":"FAQ","contact":"Contact","feelFreeToContactUs":"Feel free to contact us !","enterYourQuestionHere":"Enter your question here. Please provide the URL where you inserted your chat if you have a specific problem with your chat","sendQuestion":"Send question","yourRequestHasBeenSent":"Your request has been sent !","developers":"Developers","LookingForFreeHTML5VideoChat":"Looking for a free HTML5 video chat ?","tryOutHTML5FreeChat":"Try our Free HTML5 video chat<\/strong>: in 1 click
get your own !<\/a>.","WeHaveTheMostCompleteVideoChat":"We have the most complete video chat for your website, done in html5 and easy to integrate.","FlashOrWebrtc":"You choose Between Flash and WBERTC technology for streaming.
Html5 chat includes now real time Webrtc multi chat","tryHTML5Chat":"Try html5 webrtc chat","GetYourHtml5Chat":"Get your html5 chat","WebcamVideoChatTotallyCustomized":"Webcam video chat totally customized and free.","GetYourOwnHTML5VideoChat":"Get your own HTML5 video chat for your website or your blog.","HTML5chatGetYourOwnFreeHtml5Chat":"HTML5 chat, get your own free webrtc html5 chat. Free webcam chat script","Html5ChatAllowsYouToIntegrateQuicklyFreeHtml5Chat":"Html5 chat allows you to integrate quickly a free WEBRTC Html5 chat to your website. Get it Free.","Moderate it and customize it as you want":"Moderate it and customize it as you want","Easy to integrate, easy to admin":"Easy to integrate, easy to admin","Includes live webcam streaming":"Includes live webcam streaming","Private or public messages":"Private or public messages","Tabbed or windowed style":"Tabbed or windowed style","Webcam and chat on invitation":"Webcam and chat on invitation","Here are some features of our video webcam chat":"Here are some features of our video webcam chat:","based on nodejs sockets compatible with all browsers":"based on nodejs \/ sockets compatible with all browsers","3 differents modes : tabbed mode, windowed mode or conference mode":"3 different modes : tabbed mode, windowed mode or conference mode","Multi webcam support : stream and watch online users":"Multi webcam support : stream and watch online users","full admin panel":"full admin panel","Look and feel as you want !":"Look and feel as you want !","manyChatsInHTML5chat":"html5-chat allows you to choose different modes and customize it to infinity: a multi-user chat, a chat roulette, a conference, a chat1to1 or even a chat style 'live show'. You can do it all with one single product. HTML5 chat is suitable for any chat project you may have as a chat framework","integrate to any existing website just with 1 line of code":"integrate to any existing website just with 1 line of code","auto login features to be integarted with your existing users database":"auto login features to be integrated with your existing users database","Moderation features Inludes moderation features kickban":"Moderation features inludes moderation features kick\/ban","modern, pure GUI, easy to customize to your needs":"modern, pure GUI, easy to customize to your needs","More than 100 features included":"More than 100 features included","Full user managment":"Full user management","Gender managment":"Gender management","full screen webcam streaming":"full screen webcam streaming","and so much more...":"and so much more...","Register to get your own html5 chat":"Register to get your own html5 chat","Register to get your html5 chat: it is free. Webcam video chat included":"Register to get your html5 chat: it is free. Webcam video chat included","Get your FREE video chat now !":"Get your FREE video chat now !","You are 10 seconds from getting your own chat: just fill the form and you will yours":"You are 10 seconds from getting your own chat: just fill the form and you will yours","Enter your email here":"Enter your email here","Choose your username":"Choose your username","Choose your password":"Choose your password","Confirm your password":"Confirm your password","Get your HTML5 chat":"Get your HTML5 chat","Your script will be sent to your email. So be sure, you spell it correctly.":"Your script will be sent to your email. So be sure, you spell it correctly.","Error: password do not match":"Error: password do not match","Contact html5 chat":"Contact html5 chat","Questions about html5 chat ? Contact our chat team and get answer to your question":"Questions about html5 chat ? Contact our chat team and get answer to your question","Any question ? any recommendation ? any suggestion ?":"Any question ? any recommendation ? any suggestion ?","Please: fill this form: we will answer within 24 hours.":"Please: fill this form: we will answer within 24 hours.","sendYourQuestion":"Send question","Faq about the html5 chat":"Faq about the html5 chat","Here you can find the most common questions\/answers about the html5 chat":"Here you can find the most common questions\/answers about the html5 chat","If you cannot find the answer to your question, please use the ":"If you cannot find the answer to your question, please use the ","Purchase HTML5 chat":"Purchase HTML5 chat","Purchase now html5 chat to be embedded into your existing web site":"Purchase now html5 chat to be embedded into your existing web site","Free":"Free","OneHundred free version":"100% free version","Free chat":"Free chat","4 max webcams":"4 max webcams","3 max rooms":"3 max rooms","50 users max":"50 users max","Sign Up":"Sign Up","Full":"Full","Full registered version":"Full registered version","per year":"per year","per month":"per month","No webcam limit":"No streaming webcam limit","Unlimited room":"Unlimited room","No limitations, no ads":"No limitations, no ads","Source code":"Source code","extended version":"extended version","Inlcudes full source code":"Includes full source code","Allows you to run on your server":"Allows you to run on your server","Support included":"Support included","Updates included for 12 months":"Updates included for 12 months","HTML5 demo chat":"HTML5 demo chat","Feature list of the html5 chat":"Feature list of the html5 chat","Developers API HTML5 chat":"Developers API HTML5 chat","Here is an inexhaustive list of the html5 chat features":"Here is an inexhaustive list of the html5 chat features","We are keeping add new features every week":"We are keeping add new features every week. If you think an important feature is missing, please feel
free to suggest it<\/a>","here_are_some_features_of_our_video_webcam_chat":"Here are some features of our video webcam chat:","our_html5_is_based_on_sockets":"Our html5 is based on sockets","major_browser_compatibility":"Major browser compatibility","tab_mode_every_private_opens_in_a_new_private_tab":"Tab mode: every private opens in a new private tab","window_mode_every_chat_opens_in_a_new_draggable_window":"Window mode: every chat opens in a new draggable window","conference_mode_there_is_one_streamer_and_many_listeners_suitable_for_shows_e_learning_etc":"Conference mode: there is one streamer and many listeners: suitable for shows\/e-learning etc...","individual_draggable_webcam_support":"Individual draggable webcam support","full_screen_webcam_support":"Full screen webcam support","fullAdminPanel":"full admin panel to administrate\/customize your chat<\/a>","customized_look_n_feel_make_it_look_like_your_website":"Customized Look'n feel: make it look like your website","easy_to_integrate_1_line_of_code_to_be_inserted":"integrate : 1 line of code to be inserted !","direct_link_to_your_chat":"Direct link to your chat","auto_login_feature_so_you_can_plugin_to_your_existing_database_users":"Auto login feature: so you can plugin to your existing database users","full_moderation_features_inludes_moderation_features_kick_ban_warn":"Moderation features: includes moderation features(kick\/ban\/warn)","modern_pure_gui_easy_to_customize_to_your_needs":"Modern pure GUI, easy to customize to your needs","More_than_100_features_included_and_growing_every_day":"More than 100 features included and growing every day","full_user_managment_add_remove_edit_password":"Full user management: add\/remove\/edit\/password","rooms_management_add_edit_remove_users_or_protect_rooms_with_passwords":"Rooms management: add\/edit\/remove users or protect rooms with passwords","gender_managment_customized_it_to_your_genders_or_roles":"Gender management : customized it to your genders or roles","private_or_public_webcams_managements":"Private or public webcams managements","private_or_public_chats_on_invitation":"Private or public chats on invitation","users_filtering_by_gender_by_username":"User filtering by gender, by username","who_s_watching_me_feature":"Wo's watching me feature","mute_an_user_feature":"Mute a user feature","and_so_much_more":"and so much more...","try_it_now_to_have_a_look_at_all_features_you_can_get":"Try it now to have a look at all features you can get !","answer":"answer","what_is_html5_chat_for":"What is HTML5 chat for ?","html5_chat_allows_you_to_quickly_intergate_a_full_video_chat_to_your_website_or_blog":"HTML5 chat allows you to quickly integrate a full video chat to your website or blog","is_html5_chat_free":"Is HTML5 chat free ?","yes_we_have_a_free_version_and_a_paid_version":"Yes: we have a free version and a paid version","what_is_the_difference_between_the_free_and_paid_version":"What is the difference between the free and paid version ?","the_free_version_has_some_limited_features":"The free version has some limited features like limited number of rooms, limited number of webcam, limited bandwidth for webcams, and generally speaking less features.
The paid version has unlimited features.","how_much_cost_the_paid_version":"How much cost the paid version ?","just_check_the_prices_here":"Just check the prices here !","how_to_integrate_the_chat_to_my_existing_website":"How to integrate the chat to my existing website ?","first_register":"
First register.<\/a>
Then you will receive 1 line of javascript code. Just insert that javascript code to your website and that's all.
You can also make a direct link to the chat. (Link is provided in the email as well)","youCanAlsoEasilyIntegrateItIntoCMSsuchas":"You can also easily integrate it into ready to use CMS such as: Wordpress, WordPress, Joomla, VLD Personals, Dating Site script, PhpFox, Boonex, WooWonder...
You will find more info in your
chatadmin","how_can_i_administrate_my_chat":"How can I administrate my chat ?","you_can_administrate_your_html5_chat":"You can administrate your html5 chat in the chat admin panel.<\/a> You need your email\/password to enter chat admin.<\/a>","Notice that you can also integrate a direct link to you chat":"Notice that you can also integrate a direct link to you chat","Technical questions about your html5 chat ? We are here to help you":"Technical questions about your html5 chat ? We are here to help you","Support is included in":"Support is included in paid version of the chat<\/a>","To integrate it into existing website":"To integrate it into your existing website, you just have to copy\/paste the script you received when you registered the chat","script looks like":"script looks like","where id is your id script and uniqueKey is a token":"where id is your id script and uniqueKey is a token","if you most your data":"If you have lost your data, just login into your panel admin<\/a> and you can retrieve these data from there","How to change the dimension of the chat ?":"How to change the dimension of the chat ?","chat uses iframe to be embedded into your site. The idea is so to included that iframe into your existing element (div) and it will take 100% of that element.":"chat uses iframe to be embedded into your site. The idea is so to included that iframe into your existing element (div) and it will take 100% of that element.","I want the chat to be 640px width and 480px height: just create a div of 640px x 480px and embed the script inside !":"I want the chat to be 640px width and 480px height: just create a div of 640px x 480px and embed the script inside !","Question: I have my website ready and I manage my users by myself. How to integrate it with my existing database ?":"Question: I have my website ready and I manage my users by myself. How to integrate it with my existing database ?","This is possible with HTML5 chat!":"This is possible with HTML5 chat!","More questions ?":"More questions ?","Please contact us !":"Please contact us !","Quick tips how to integrate your video chat into your website":"Quick tips how to integrate your video chat into your website","does_it_work_on_any_browser":"Does html5 chat works on any browser ?","webrtc_is_supported_on_firefox_and_chrome":"yes: if works on any flash enabled browser. If you want a multi user chat using WEBRTC technology, please visit Html5 chat<\/a>","PleaseRegisterYoGetYourOwnCopy":"Free version of html5-chat<\/a>
Please register to get your own copy to remove that message. !","quickPrivateMessage":"Send mention (@)","quickPrivateMessageTo":"Send private message to %s","myWebcam":"My webcam","pushToTalk":"Push to Talk","youNeedToEnableYourWebcamToPushToTalk":"You need to enable your webcam to talk","youAreTalking":"You talk...","userIsTalking":"%s is talking.