@if(!defined('LOAD_CHAT'))
	
	@push('js')
		<script src='//cdnjs.cloudflare.com/ajax/libs/list.js/1.1.1/list.min.js'></script>

		<script>
			var __baseUrl = {!! json_encode(url('/')) !!};
			var __sendUrl = "{!! route('Conferencing.Messenger.ajax::message.new') !!}";
			var __destId = {{@request()->route('id') ?? 0}};

			var show = function(data) {
				console.log(data);
			}

			var msgshow = function(data) {
				__destId = $('#dest_id').val() ? $('#dest_id').val() : false;
				var user_id = data.user_id;
				console.log('msgshow');
				console.log(user_id);
				console.log(__destId);
				
				if (user_id != __destId) {
					console.log('remove user');
					var $badge = $('#badgeConnected-' + user_id);
					var $connected = $('#rowConnected-' + user_id);
					var msg_attente = $badge.html() ? $badge.html() : 0;
					msg_attente++;
					$badge.html(msg_attente);
					$badge.removeClass('d-none');

					$connected.remove();
					var html = $connected;
					
					$('#people-connected').prepend(html);

					// $connected.insertBefore('#people-connected li');

					handleConnected();


					// console.log('send event');
  					// userChannel.trigger('client-someeventname', { your: 'data' });
  					// conversationChannel.trigger('conversation-someeventname', { your: 'data' });
					return false;
				}

				var html = '<li id="message-' + data.id + '">' +
				'<div class="message-data">' +
				'<span class="message-data-name"> ' + data.sender.first_name + ' ' + data.sender.last_name + '</span>' +
				'<span class="message-data-time">@if (App\Repositories\Languages::getCurrent() =='fr') A l\'instant @else 1 second ago @endif</span>' +
				'</div>' +
				'<div class="message my-message">' +
				data.message +
				'</div>' +
				'</li>';

				$('#talkMessages').append(html);
				scrollBottom('.chat-history');

			}

			var general = function(data) {

				var $isExist = $('#rowConnected-' + data.id).length;
				console.log('isExist', $isExist);

				if ($isExist == 0) { 
					var html = '<li id="rowConnected-' + data.id + '" data-id="' + data.id + '" data-name="' + data.first_name + ' ' + data.last_name + '" data-company="' + data.company + '" class="pb-3 rowConnected" role="button"><img src="/storage/Conferencing/Guests/user-' + data.id + '.png" class="img-fluid pull-left pr-2" /><span class="badge badge-primary pull-right d-none" id="badgeConnected-' + data.id +'">0</span><span class="name">' + data.first_name + ' ' + data.last_name + '</span><br><span class="company"><small>' + data.company + '</small></span></li>';
					
					$('#people-connected').append(html);

					var $badge = $('#countConnected');
					var countConnected = $badge.html() ? $badge.html() : 0;
					countConnected++;
					console.log('countConnected', countConnected);
					$badge.html(countConnected);
					$badge.removeClass('d-none');
					handleConnected();
				}
			}

			var remove_guest = function(user) {
				console.log('remove_guest');
				console.log(user.id);
				// console.log(user.id);
				var $isExist = $('#rowConnected-' + user.id).length;
				console.log('isExist', $isExist);

				if ($isExist != 0) {
					$('#rowConnected-' + user.id).remove(); 
					var $badge = $('#countConnected');
					var countConnected = $badge.html() ? $badge.html() : 0;
					countConnected--;
					console.log('countConnected', countConnected);
					$badge.html(countConnected);
					$badge.removeClass('d-none');
					handleConnected();
				}
			}


			var mirada_event = function(etat) {
				console.log("mirada_event");
				console.log(etat);
				if (etat == 'avant') {
					mirada.display_event_before();
				} else if (etat == 'pendant') {
					mirada.display_event_live();
				} else if (etat == 'apres') {
					mirada.display_event_after();
				}
			}

			var redirectFundGlobam = function() {
				document.location.href = "https://fundglobam.com";
			}

			function initSendMessage() {
				$('#talkSendMessage button').off('click').click(function(e) {
					e.preventDefault();
					var request, data;
					data = $('#talkSendMessage').serialize();

					request = $.ajax({
						method: "post",
						url: __sendUrl,
						data: data
					});

					request.done(function (response) {
						if (response.status == 'success') {
							$('#talkMessages').append(response.html);
							$('#message-data').val('');
							scrollBottom('.chat-history');
						}
					});
				})
			};

			function initDeleteMessage() {

				$('body').off('click').on('click', '.talkDeleteMessage', function (e) {
					e.preventDefault();
					var tag, url, id, request;

					tag = $(this);
					id = tag.data('message-id');
					url = __baseUrl + '/ajax/message/delete/' + id;

					if (!confirm('Do you want to delete this message?')) {
						return false;
					}

					request = $.ajax({
						method: "post",
						url: url,
						data: {"_method": "DELETE"}
					});

					request.done(function(response) {
					   if (response.status == 'success') {
							$('#message-' + id).hide(500, function () {
								$(this).remove();
							});
					   }
					});
				})
			}

			function scrollBottom(sel) {
				$(sel).scrollTop(function() { return this.scrollHeight; });
				//	$('.chat-history').animate({scrollTop: $('.chat-history').prop("scrollHeight")}, 500);
				// $('.chat-history').animate({scrollTop: this.scrollHeight}, 500);
				// $('.chat-history').scrollIntoView(false);
				// var objDiv = $('.chat-history');
				// objDiv.scrollTop(1E10);
			    // objDiv.animate({"scrollTop": objDiv[0].scrollHeight}, "slow");
			}

		</script>
		
		{{-- @include('apps.Conferencing.Messenger.partials.handlebars') --}}

		{!! App\Repositories\Conferencing\Chats::talk_live([
			'user'=>[
				'id' => auth()->user()->id, 
				'callback' => ['msgshow']
			],
			'conversation'=>[ 
				'callback' => ['general']
			], 
		]) !!}

	@endpush

	@push('css')
		<link rel="stylesheet" href="/assets/apps/Conferencing/css/chat.min.css?{{ time() }}"> 
	@endpush
	@php(define('LOAD_CHAT', true))
@endif