(()=>{
    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 = `
        <div id="modalMessenger">
            <input type="text" id="messengerInput" placeholder="Enter your username">
        </div>`;
            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 = `
            <div id="messengerNotificator">
                <div id="messengerNotificatorHeader">
                    <div id="filterOnlineUsers" title="Toggle All or online only users"></div>
                    <span>${this.traductions.users}</span>
                    <span id="messengerNotificatorCounter"></span>
                    <i class="fa fa-2x fa-caret-down"></i>
                    <button id="messengerExit"><i class="fa fa-sign-out" title="exit chat"></i></button>
                </div>
                <div id="genderFilterDiv"></div>
                
                <div style="display: flex;">
                    <input id="messengerNotificatorSearch" type="text" placeholder="${this.traductions.searchUsers}">
                    <button id="messengerClearSearch"><i class="fa fa-close"></i></button>
                </div>
                <div id="messengerNotificatorContent"></div>
                <div id="messengerNotificatorFooter"></div>
            </div>
        `;
        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 = `<div id="${this.container}"></div>`;
		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 = `<strong>${user.username}</strong> 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<num;i++) {
            let rnd = Math.round(Math.random()*1000);
            this.addUser({id:rnd, username:`guest_${rnd}`})
        }
    };

    addUser (user) {
    	let genderEl = '' +
			`<div id="genderChecboxContainer${user.gender}">
				<label for="genderChecbox${user.gender}">${user.gender}</label>
				<input value="${user.gender}" checked type="checkbox" name="genderChecbox${user.gender}" id="genderChecbox${user.gender}">
			</div>`;
    	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)?`<a href="${user.profile}"><i class="fa fa-info-circle fa-2x"></i></a>`:'';
        let gender = (user.gender)?user.gender:'';
        let el = `
                <div title="${gender}" class="messengerNotificatorUserItem ${gender}" data-profile="${user.profile}" data-userid="${user.id}" data-username="${user.username}" data-avatar="${user.avatar}" title="${title}"> 
                    <div><img src="${this.myUser.imagePath}${user.avatar}" alt=""></div>
                    <div>${user.username}</div>
                    <div class="messengerStatus ${user.status}"></div>
                    <div class="profileUser" data-profile="${user.profile}">${profileEl}</div>
                </div>
                `;
        $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 = `
        <div class="messengerWebcamContainer">
            <video id="myMessengerVideo" autoplay="" playsinline="" muted=""></video>
            <video id="hisMessengerVideo" autoplay="autoplay" playsinline="" controls></video>
            <div class="webcamHeader"><i class="fa fa-phone"></i>
                <span id="messengerCallingUsername">${this.myUser.call1to1User.username}</span>
            </div>
            <div id="MessengerPhotoCallerContainer">
                <img src="${this.myUser.imagePath}${this.myUser.call1to1User.avatar}" alt="${this.myUser.call1to1User.username}">
            </div>
            <div class="webcamFooter">
                <div><button id="messengerMuteAudioBtn" title="Mute/Unmute your micro" class="hiddenButton"><i class="fa fa-microphone fa-2x"></i></button></div>
                <div><button id="messengerHangoutBtn" title="Hang out call"><i class="fa fa-phone fa-2x"></i></button></div>
                <div><button id="messengerToggleWebcamBtn"  title="Answer the call" class="${classeWebcamBtn}"><i class="fa fa-video-camera fa-2x"></i></button></div>
            </div>
        </div>`;
        jQuery('#messengerContainer').append(template);
    };

    updateNotification  () {
        this.socket.emit('getCountMessengerUnread', (messageCount)=>{
            if (!messageCount) {
                messageCount = '';
            }
            let html = `
                <div id="messengerNotificationButton">
                    <i class="fa fa-comment"></i> <span>${messageCount}</span>
                </div>
            `;
            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 = `<div class="message ${classe}">
                        <div class="messageUsername"><span class="timeAgo" data-ago="${now}">${ago}</span></div>
                        <div class="messageBubble">${message}</div>
                </div>
        `;
        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 = `<div class="message ${classe}">
                        <div class="messageUsername"><span>${fromUser.username}</span><span class="timeAgo" data-ago="${extras.time}">${ago}</span></div>
                        <div class="messageBubble">${message}</div>
                </div>
        `;
        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")?`<a href="${user.profile}">${user.username}</a>`:user.username;
        let template = `
        <div class="content" data-userid="${user.id}" data-username="${user.username}">
            <div class="header ${headerClass}">
                <div><img class="messengerAvatar" src="${this.myUser.imagePath}${user.avatar}" alt="${user.username}">
                <strong>${username}</strong>
                <span class="isWrtiting">is writing</span>
                </div>
                <button class="muteUserBtn ${mutedClass}" title="Click to mute/unmute user"><i class="fa fa-check"></i></button>
                <button class="webcamBtn"><i class="fa fa-video-camera"></i></button>
                <button class="closeBtn"><i class="fa fa-close "></i></button>
            </div>
            <div class="messages">    
            </div>
            <form class="footer" onsubmit="return false;">
                <input type="text" data-userid="${user.id}" placeholder="${this.traductions.yourMessage}">
                <button type="button" class="messengerEmojiBtn">😀</button>
                <button type="button" class="clearMessengerBtn"><i class="fa fa-eraser"></i></button>
            </form>            
        </div>
        `;
        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 = `
                <div class="menuMessengerItem" data-id="${message.fromid}" data-username="${extra.from}" data-avatar="${extra.avatar}"> 
                    <div>
                        <img src="${this.myUser.imagePath}${extra.avatar}" alt=""><strong>${extra.from}</strong>
                    </div>
                    <div class="ago">${this.ago(extra.time)}</div>
                    <div class="menuMessengerBall ${classeBall}"></div>
                    <div class="messengerMenuMessage">${message.message}</div>
                </div>
            `;
            menuItems+=menuItem;
        });
        let el = `
            <div class="menuMessenger">
                <div class="headerMenuMessenger">Unread: <strong>${messages.length}</strong></div>
               ${menuItems}
            </div>
        `;
        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 ? <button data-answer="yes">Yes</button>  <button data-answer="no">No</button>`;
            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 <b>chat<\/b> on your server<br>We can install the <b>media server part<\/b> (streaming) and the <b>sockets<\/b> (chat text) on your server.<br>","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. <b>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.":"<a href='\/purchase'>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 <b>%s<\/b> minutes. <br>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 <strong>Free HTML5 video chat<\/strong>: in 1 click <a href='\/register'>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. <br>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 <a href=\"\/contact\" title=\"suggest feature\">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 <a href='\/chatadmin' title='chat admin panel'>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.<br>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":"<a href='\/register' title='register chat'>First register.<\/a><br>Then you will receive 1 line of javascript code. Just insert that javascript code to your website and that's all.<br>  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...<br> You will find more info in your <a href='\/chatadmin'>chatadmin<a>","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 <a href='\/chatadmin' title='chat admin panel'>chat admin panel.<\/a> You need your email\/password to enter <a href='\/chatadmin' title='chat admin panel'>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 <a href='\/purchase' title='purchase html5 chat'>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 <a href='\/register' title='register the html5 chat'>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 <a href='\/chatadmin' title='chat admin panel'>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 <a href='https:\/\/webrtc-chat.com\/'>Html5 chat<\/a>","PleaseRegisterYoGetYourOwnCopy":"Free version of <a href='https:\/\/html5-chat.com'>html5-chat<\/a> <br>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.<br><div class='centered'><button class='raiseHandBtn btn btn-sm btn-success'>I want to talk<\/button><\/div>","userDeniedPrivateChat":"Sorry, %s denied the private chat.","quizBadAnswer":"<i class='fa fa-thumbs-down'><\/i> Sorry, bad answer","quizGoodAnswer":"<i class='fa fa-thumbs-up'><\/i> Congratulations to <b>%s<\/b> for the good answer <b>%s<\/b>","quizGoodAnswer1":"<i class='fa fa-thumbs-up'><\/i> Congratulations to <b>%s<\/b> for the good answer <b>%s<\/b>","quizGoodAnswer2":"<i class='fa fa-thumbs-up'><\/i> Greetings to <b>%s<\/b> for the good answer <b>%s<\/b>","quizGoodAnswer3":"<i class='fa fa-thumbs-up'><\/i> Bravo to <b>%s<\/b> for the good answer <b>%s<\/b>","quizGoodAnswer4":"<i class='fa fa-thumbs-up'><\/i> Well done <b>%s<\/b> for the good answer <b>%s<\/b>","quizGoodAnswer5":"<i class='fa fa-thumbs-up'><\/i> GREAT ! <b>%s<\/b> gave the good answer <b>%s<\/b>","guestUserIsNotAllowed":"You need to register to use that feature","whoSings":"Who sings ?","Clue":"Clue","watchAtMe":"Watching me:","userInfo":"User info","BroadcastOff":"BroadcastOff","BroadCasting":"BroadCasting","ConfirmBroadcast":"Do you want to broadcast your webcam to all users in room ?","weCanInstall":"* we can install the chat for client with no extra cost. Allow us up to 7 days to install it on client's server.","XhasLeftTheChat":"%s has left the chat.","XhasJoinedTheChat":"%s has joined the chat.","WPChatPlugin":{"WP html5 chat plugin":"WP html5 chat plugin","Get the free WordPress HTML5 plugin":"Get the free WordPress HTML5 plugin","Html5 is now available to be quickly inserted into your WP blog":"Html5 is now available to be quickly inserted into your WP blog","Easily integrate yout HTML5 chat into your wordpress plugin with that official wordpress pkugin.":"Easily integrate your HTML5 chat into your wordpress plugin with that official wordpress plugin.","WP official html5-chat plugin":"WP official html5-chat plugin","Installation process":"Installation process","Install and activate it in WP":"Install and activate it in WP","check your email: you will receive the password for your html5-chat":"check your email: you will receive the password for your html5-chat","insert the shortCode into your page or post":"insert the shortCode into your page or post","you can configure your chat look&feel through your \u201cconfigure chat\u201d link":"you can configure your chat look&feel through your \u201cconfigure chat\u201d link","Click here, if you need a WP plugin rather than JS script":"Click here, if you need a WP plugin rather than JS script"},"Do you have a technical question about html5-chat.com ?":"Do you have a technical question about html5-chat.com ?","Are Webcams unlimited ?":"Are Webcams unlimited in full version ?","Unlimited webcams Answer":"<p>Yes they are unlimited for streamers. But not for viewers. We limit them to 8. Why ? Because we don't believe you are able to watch 200 TV channels at the same time. More seriously, because having unlimited watchers will kill your CPU and our Bandwidth as well and slow down all chats. You are using a shared hosting. If you really think you need unlimited watchers, then you have 2 solutions: <\/p> ","Unlimited webcams Answer2":"<ul><li><a href='https:\/\/html5-chat.com\/purchase'>Get the source code version<\/a> and host it yourself <\/li><li><a href='https:\/\/html5-chat.com\/hosting'>Host the streaming part yourself<\/a><\/li><\/ul>","Please ask question on our html5-chat forum google group":"Please ask question on our html5-chat forum google group","closePrivateChatWhenUserLeaves":"Close private chat when user leaves","Question: How to encrypt data when using html5-chat ?":"Question: How to encrypt data when using html5-chat ?","You can encrypt data using the jwt.io library":"You can encrypt user data using the jwt.io library. <a href='\/jwt'>Read the whole tutorial on how to encrypt data<\/a> ","Calendar":"Calendar","Send":"Send","SeeMyProfile":"See my profile","Parameters":"Settings","youAlreadyAskedForPrivate":"You already requested a private and need to wait to request again","Camera":"Camera","Sound":"Sound","Friends":"Friends","Close youtube":"Close youtube","Pick a room":"Pick a room","Delete User Messages":"Delete User Messages","Whisper":"Whisper (#)","Confirm clear chat":"Confirm clear chat","Mute as Ban":"Mute as Ban","enterYourTextHere":"Enter your text here, Shift+enter for multiline","Profile":"Profile","now":"Now","yearsAgo":"%s year%s ago","monthsAgo":"%s month%s ago","daysAgo":"%s day%s ago","hoursAgo":"%s hour%s ago","minutesAgo":"%s minute%s ago","confirm":"Confirm","users":"Users","First chat To be Chrome\/Firefox\/Edge\/Safari and Iphone\/Android compatible":"First chat To be Chrome\/Firefox\/Edge\/Safari. Iphone AND Android compatible","Webrtc Low Streaming":"Webrtc Low Streaming","Flash Streaming or Webrtc Streaming":"Webrtc Streaming","Report User":"Report %s to admin","Report Description":"Report Description","Report":"Report","Report Send to Admin":"Report Send to Admin","Maxumum number of users in room reached. Pick another room":"Maximum number of users in room reached. Pick another room","Show IP":"Show IP","doubleConnect":"Disconnected : connected from other place","privateChat":"Private","Globally Mute user":"Globally Mute user","enterYourTextHereInRoom":"Chat in room %s: enter text here  (Shift + Enter for multilines)","chatPrivateWith":"Private chat with %s","removeFriend":"Remove Friend","approveFriend":"Accept as friend","resendFriend":"Send friend request","removeUserFromFriends":"Remove <b>%s<\/b> from my friends ?","acceptUserAsFriends":"Accept <b>%s<\/b> as friend ?","resendUserRequest":"Resend friend request to <b>%s<\/b> ?","requestFriend":"Friend request","FriendRequested":"Friend requested","UserRefused":"User refused","UserRefusedToBeYourFriend":"Sorry but <b>%s<\/b> refused to be your friend","UserAccepted":"User accepted","YouAreNowFriendWith":"You are now friend with <b>%s<\/b>.","UserDeleted":"Delete friend","UserIsNotYourFriendAnyMore":"<b>%s<\/b> is not your friend any more","createMyRoom":"Create my own room","errorCreatingRoom":"Error, room not created","maxNumberOfRoomCreatedReached":"You cannot create new rooms.","roomDeleted":"Room deleted","roomWasDeleted":"Room <b>%s<\/b> was deleted","inviteUserIntoPrivateRoom":"Invite %s to join room %s","userWouldLikeToInviteToHisPrivateRoom":"<b>%s<\/b> invites you to join their room <b>%s<\/b>","Number":"Number","do not disturb with private requests":"Do not disturb with private chat requests","do not play sound effects":"Do not play sound effects","chooseDurationOfMuteInMinutes":"Choose duration of the mute (jail). Jailed user cannot write in chat (in minutes)","mutePrisonUser":"Jail user","Webcam error: Please use Firefox or Chrome browser":"Webcam error: Please use Firefox or Chrome browser","Webcam error: Please use Safari":"Webcam error: Please use Safari","minutesMute":"Jail in minutes","warnUserOfMute":"Warn user that he was jailed","youHaveBeenMutedForMinutes":"You have been muted for  %s minutes.<br>Reason:%s","MaximumSizeAllowed":"Maximum size : %s Kbytes","ThisRoomAllowedToGenderOnly":"This room is only allowed to gender %s","All":"All","Reserved to gender":"Reserved to gender","NotReserverToGender":"Not reserved - everyone can enter","promoteUser":"Promote user","promoteUserX":"Promote %s in room %s as:","youHaveBeenPromotedto":"You have been promoted to role %s","PermanentPromote":"Permanent Promote","Search":"Search","lockChatScroll":"Lock\/Unlock the chat scroll","unlockChatScroll":"Unlock chat scroll","help":"Help","quitAndDisconnect":"Quit and disconnect","userHasBeenKicked":"<i class='fa fa-exclamation-circle'><\/i> <b>%s<\/b> has been ejected from chat","userHasBeenBanned":"<i class='fa fa-exclamation-circle'><\/i> <b>%s<\/b> has been banned from chat","userHasBeenMutedBanned":"<i class='fa fa-exclamation-circle'><\/i> <b>%s<\/b> has been muted on chat","Gifs and upload":"GIF search and uploads","Backgrounds":"Backgrounds","confirmKick":"Confirm Kick","jailUserX":"Jail\/Mute %s","explainWhyYouMute":"Explain why you jail","enterAsGuest":"Enter as guest","purchase Credits":"<span data-role='credits'>%s<\/span> credits. Purchase.","Sorry, you dont have enough credits":"Sorry, you dont have enoug credits.<br>Purchase now ?","Private chat costs is":"Private chat cost is <b>%s<\/b> credits per minute.<br>Do you want to start the private chat ?","Private chat has Started Please Leave":"Private chat has just started.<br> Sorry, you must leave the room","You are now in private chat ":"You are now in private chat","Sorry this username is already taken":"Sorry this username is already taken","Disable youtube":"Disable youtube","you are not allow to request webcam":"Sorry, but you are not allow to request private webcams","kickUserXFromRoom":"Kick %s from room %s","kickFromRoom":"Kick from my room","userDeniedWebcam":"%s denied to access their webcam","userLeftPrivateChat":"User %s has left the private chat","whisperText":"Whisper","mentionText":"Mention","youWillSendWhisperTo":"You will send a whisper to %s","youWillMention":"You will mention to %s","warningAdultRoom":"Warning, you will enter an adult room","yourAge":"Your age","invalidAge":"Invalid age","Reserved to role":"Reserved to role","NotReserverToRole":"Not reserved to Role","ThisRoomAllowedToRoleOnly":"This room is allowed only to %s","hour":"hour","hours":"hours","day":"day","week":"week","month":"month","BanUntil":"Ban until","JailUntil":"Jail until","invisible":"Invisible","maximumWebcamTimeSpent":"Sorry, You reached the maximum authorized time to watch webcams today.","youMustAcceptTermsOfUse":"You must accept the terms of use.","friendModeOnly":"Friend mode only","actionForbiddenToMinors":"Action forbidden to minor of age","Age":"Age","reason":"reason","userReason1":"This person annoys me","userReason2":"Fake profile","userReason3":"This profile represents a company","userReason4":"This profile spams","userReason5":"Other reason","roomReason1":"This room is offensive","roomReason2":"This room is used for abuse","roomReason3":"This room represents a company","roomReason4":"Spam room","roomReason5":"Other reason","vote":"Vote","Are you sure to vote":"Are you sure to vote ","User X has voted for you":"<i class='fa fa-gift'><\/i> Congratulations, <b>%s<\/b> has voted for you","Thanks for voting":"Thanks for voting","already Voted":"You already voted for that user.","ThisRoomNotAllowedToGender":"This room is not allowed to gender: %s","ThisRoomNotAllowedToRole":"This room is not allowed to role: %s","ThisRoomAllowedToThisGender":"This room is not available for this gender","ThisRoomNotAllowedToThisRole":"This room is not available for this role","searchRoom":"Search a room","adultRoom":"Adult room","youMustSwitchYourWebcam":"You must switch your webcam on to take a snapshot","takeSnapshot":"Upload snapshot","Snapshot":"Snapshot","DoYouWantToTakeThatSnpashot":"Do you want to upload that snapshot ?","youNeedWebcamForExclusiveChat":"You need to switch your cam on to request an excusive chat","call1to1":"Call 1to1","userRequested1to1Chat":"<i class='fa fa-phone'><\/i> %s has requested a video 1to1 call. %s","callingUser":"Calling %s","didNotAnswer":"Sorry, <b>%s<\/b> did not answer to your call","call1to1Ended":"Call with %s has ended","call1to1Refused":"Sorry, but <b>%s<\/b> has refused to take your call ","Incoming1to1From":"<i class='fa fa-phone'><\/i> Incoming call1to1 from %s","waiting":"Waiting...","youMustSwitchWebcamOn":"You must switch your webcam on to accept the call","switchWebcamAndAcceptCall":"Switch webcam and accept call","denyCall":"Deny the call","guestTrialMessage":"You don't have permission for this feature","Please login to chat panel and start a support ticket":"Please login to chat panel and start a support ticket","areYouSureToCall1to1":"Are you sure you want to call %s ?","notAvaibleInBrowser":"Not available in your browser. Use a modern browser such chrome","userHasStartedBroadcasting":"<i class='fa fa-video-camera' aria-hidden='true'><\/i> <b>%s<\/b> has just started a public broadcast","muteWebcam":"Mute webcam","askPrivateChat":"Ask private chat","AreYouSureToRequestPrivateChatWithModel":"Are you sure you want to request a private video show with %s ?<br>(Price per minute is %s %s)","sorryYouDontHaveEnoughCredits":"Sorry, you dont' have enough credits","doYouAcceptPrivateShow":"Do you accept a private show requested by <b>%s<\/b> ?","privateShowRefused":"Sorry, your request for private show was refused.","privateShowStarted":"Private show started","sendTips":"Send tips","chooseAmoutOfTips":"Choose amount of tips to send","credits":"credits","orGive":"or give","creditsImmediatly":"credits immediately","youMustGiveMinimumCredits":"Soyez g\u00e9n\u00e9reux: il faut donner au moins 10 credits","userSentYouTips":"<b>%s<\/b> has sent you <b>%s<\/b> credits","userSentCredits":"<b>%s<\/b> has sent <b>%s<\/b>credits","stayConnected":"Stay connected","privateShowEnded":"Private show ended","endPrivateShow":"End private show","Send Tip":"Send tip","UserOpenHisWebcam":"%s has opened their webcam","broadcasting":"broadcasting","talks":"talks","playRandomCam":"Play Random Cam","Video":"Video","Audio":"Audio","chooseWebcam":"Choose webcam","yourWebsiteNeedsHTTPS":"Error:Website needs to be HTTPS to access webcam","youMustSelectAnUser":"You must select a user","Next":"Next","Searching":"Searching","youAreConnectedWith":"You are connected with %s","errorMedia":"Cannot access webcam: make sure you enabled webcam access. Make sure webcam is not used by another webcam application","sortByUser":"Sort by username","sortWebcam":"Sort by webcam","XhasTurnedOnHisCam":"%s has turned on their cam","InviteToWatchMyCam":"Invite to watch my cam","userInvitedToWatchHisCam":"%s has invited you to watch their cam","userDeniedWatchCam":"%s has denied to watch your cam","youRequestedUserToWatchYourCam":"You invited %s to watch your cam","purchase":"Purchase","price":"Price","minutes":"Minutes","Activity":"Activity","years":"years","Report activity":"Report Activity","MaxRoomsOpenedReached":"You reached the maximum number of rooms","ViewWebcam":"View webcam","CloseWebcam":"Close webcam","NotifyUserEntersRoom":"Notify user enters room","checkWhoWatchesMe":"Check to show who's watching me users only","MyUserMenu":"My user menu","cannotPostIdenticalMessage":"Can't post an identical message","webcamMandatoryToEnterRoom":"Webcam is mandatory to enter this room","SendFileAttachment":"Send file Attachment","FileXSentSuccessFully":"File %s was sent with success.","UserXUploadedFile":"%s uploaded file %s","download":"Download","OpenInModal":"Open in modal","OpenInNewWindow":"Open in new window","draw":"Draw","insertDraw":"Insert draw","screenSharing":"Screen sharing","Delete Message":"Delete message","WhatToDo":"What to do ?","DeleteAllMessages":"Delete ALL messages for ALL users","JustCleanMyChat":"Just clean my chat","muteAll":"Mute all users (except me)","lockRoom":"Lock Room","unlockRoom":"Unlock Room","SorryRoomIsLocked":"Sorry, this room has been locked by owner","Requests":"Requests","GifSearch":"Image","numberWatchers":"Number of people watching","resetAvatar":"Reset avatar","askPrivateWebcamShow":"Ask private webcam show","banByFingerPrint":"Ban this user by browser fingerprint(can give false positives to other users)","NoInternetConnection":"No internet connection","description":"Description","gender":"Gender","role":"Role","country":"Country","status":"Status","Enter url youtube":"Enter url youtube","sortByRole":"Sort by role","ignoreWhisper":"Ignore whisper","deleteRoom":"Delete room","swithMyCamOn":"Switch my cam on","youAreAlreadyInExclusiveChat":"You are already in exclusive chat","youAreNotAllowedToEnterThisRoom":"You are not allowed to enter this room","sendPublic":"Send public","sendPrivate":"Send private to %s","sendMention":"Send mention to %s","yourCannotEnterThisRoomBecauseThereisNoRoleX":"You cannot enter that room because there is no <b>%s<\/b> present in this room","disableWebcam":"Disable webcam","enableWebcam":"Enable webcam","playVideo":"On","pauseVideo":"Off","unmuteMicro":"On","muteMicro":"Off","pushToTalkFreeHand":"Push to talk Free Hand","enterWebradioUrl":"Enter webradio URL (https:\/\/)","userXDoesNotAcceptPrivateChats":"Sorry, user %s does not accept private requests right now.","warnUserOfBan":"Warn user that he was banned","seeLastMessages":"See last messages","voteToMute":"Vote to mute %s ?","sendGift":"Send gift","userXSentYouGiftXYouHaveWonXcredits":"Great: User <b>%s<\/b> has just sent you <b>%s<\/b>. You have won <b>%s<\/b> credits","userXSentGiftXToUserXWhoWonXcredits":"User <b>%s<\/b> has just sent <b>%s<\/b> to <b>%s<\/b> who won <b>%s<\/b> credits","giftReceived":"Gift received","admin":"admin","YourRoleIsNow":"Your role is now %s","YourRoleHasChanged":"Your role has changed","YouHaveNowRoleXThanksToBadgeY":"You have now the role of %s thanks to your badge <b>%s<\/b>","addTopic":"Add topic","notifyUserStartsWebcam":"Notify when user starts webcam","CamRequests":"Cam requests","DoNotDisturbWithCamRequests":"Do Not Disturb With Cam Requests","NoOnlineModels":"No online models.","ThereIsNModelsOnline":"There is %s models online. You need to select one by choosing her from the user list (click on her username)","NotifyUseReceivedGift":"Notify user received gift","PreventGifReceive":"Prevent receiving GIFs","yourMessage":"Your message","userHasBeenUnmutedUnbanned":"<i class='fa fa fa-exclamation-circle'><\/i> <b>%s<\/b> has been unmuted","fiterByAge":"Filter by age","TooManyConnections":"Too many connections","roleCanReceiveGift":"Sorry, %s cannot receive gifts","roleCannotreceiveTips":"Sorry but %s cannot receive tips","passwordTip":"Password should be at least 8 characters in length and should include at least one upper case letter, one number, and one special character","MutedUsers":"Blocked users","SendOfflineMessage":"Send Offline Message","ReadMessage":"Read message"});