еще плохо знаю js, прошу посмотреть участки кода js и php, и не плеваться, а помочь советом, подсказать где исправить ошибки, что бы ускорить работу скрипта, или же что напрочь убрать.
Это виджет поддержки (знаю про сокеты, но нагрузки на этот модуль пока нет, да и опыта такого тоже), при отправке по клику в виджете сообщения пользователю, сообщение появляеться спустя 1 - 1.5 секунды, что визуально долго, и знаю сайты где чат реализован так же с аяксом, но визуальная отправка моментальная.
Прошу помочь мне с этим вопросом Всем спасибо!
Код js
<script type="text/javascript">
function send_supportWidget()
{
//Получаю параметры
var author_type = '{{ chat.author_type == user ? '-left' : '-right' }}';
author_type_img = '{{ chat.author_type == 'user' ? '/templates/backend/img/support.png' : user.getAvatar() }}';
author_type_usr = '{{ chat.author_type == 'user' ? 'Support' : user.getDisplayName() }}';
author_message = '{{ processPic(chat.body) }}';
body = $("#textInput").val()
var body_div ='<div class="chat-message '+ author_type +'"> <div class="chat-message-avatar"> <img src="'+ author_type_img +'" alt="" class="chat-avatar -small"> </div> <div class="chat-message-text"> '+ body +' </div>';
// и отправляю
$.ajax({
type: "POST",
url: "/support/sendMessage_widget",
data: {body: body},
success: function(response) { //Данные отправлены успешно
if (body === "") {
send__error();
} else {
var author_message = '{{ chat.time }}';
document.getElementById("textInput").value = "";
$('.chat-messages-content').append(body_div);
document.getElementById('chat-messages-content').scrollIntoView({ behavior: 'smooth', block: 'end' });
}
},
error: function(response) {
send__error();
}
});
};
function send__error(){
Swal.fire({
type: 'error',
timer: 2000,
title: 'Ошибка отправки сообщения',
text: 'Поле ввода текста пусто, или же ошибка подключение к сети Интернет',
onBeforeOpen: () => {
Swal.showLoading()
timerInterval = setInterval(() => {
Swal.getContent().querySelector('b')
.textContent = Swal.getTimerLeft()
}, 2400)
},
onClose: () => {
clearInterval(timerInterval)
}
}).then((result) => {
if (
/* Read more about handling dismissals below */
result.dismiss === Swal.DismissReason.timer
) {
}
});
return false;
}
</script>
Код с контроллера
<?php
class controller_support_supportwidget extends controller {
function main__widget()
{
$this->_template = 'support__widget.tpl';
$user = user::i()->getUser();
$support_list = model_support::getList($user['id']);
$this->assign('chat_list', $support_list);
$this->assign('user', $user);
model_support::setRead();
}
function sendMessage_widget()
{
$result2 = false;
$imager = new imager('support');
$picture = $imager->process('picture');
if($picture)
$result2 = model_support::setMessage('<img>/m/support/'.$picture.'</img>');
$text = $_POST['body'];
$result = model_support::setMessage($text);
if($result || $result2)
{
user::i()->setFlash('send_message_success');
}
else
{
user::i()->setFlash('send_message_error', array('error_code' => $result));
}
exit();
}
}
Код с модели модуля
public static function setMessage($text, $user_id = false, $author_type = 'user', $color = '')
{
if(!$user_id)
{
$user = user::i()->getUser();
$user_id = $user['id'];
}
else
{
$user = model_user::getById($user_id);
}
$readed = ($author_type == 'user') ? 1 : 0;
if(trim($text) == '')
return false;
$new_message = database::i()->support()->insert(array(
'body' => $text,
'user_id' => $user_id,
'author_type' => $author_type,
'readed' => $readed,
'created_at' => time(),
'additional_color' => $color
));
if($author_type == 'manager')
{
$maildata = array(
'text' => $text
);
model_mail_query::add(
config::i()->get('app/mail_from'), // from
$user['login'], // to
'Получен ответ от поддержки', // subject
'support', // template
$maildata // data
);
}
return $new_message;
}
<script type="text/javascript">
function send_supportWidget()
{
//Получаю параметры
var author_type = '{{ chat.author_type == user ? '-left' : '-right' }}';
author_type_img = '{{ chat.author_type == 'user' ? '/templates/backend/img/support.png' : user.getAvatar() }}';
author_type_usr = '{{ chat.author_type == 'user' ? 'Support' : user.getDisplayName() }}';
author_message = '{{ processPic(chat.body) }}';
body = $("#textInput").val()
var body_div ='<div class="chat-message '+ author_type +'"> <div class="chat-message-avatar"> <img src="'+ author_type_img +'" alt="" class="chat-avatar -small"> </div> <div class="chat-message-text"> '+ body +' </div>';
// и отправляю
$.ajax({
type: "POST",
url: "/support/sendMessage_widget",
data: {body: body},
success: function(response) { //Данные отправлены успешно
if (body === "") {
send__error();
} else {
var author_message = '{{ chat.time }}';
document.getElementById("textInput").value = "";
$('.chat-messages-content').append(body_div);
document.getElementById('chat-messages-content').scrollIntoView({ behavior: 'smooth', block: 'end' });
}
},
error: function(response) {
send__error();
}
});
};
function send__error(){
Swal.fire({
type: 'error',
timer: 2000,
title: 'Ошибка отправки сообщения',
text: 'Поле ввода текста пусто, или же ошибка подключение к сети Интернет',
onBeforeOpen: () => {
Swal.showLoading()
timerInterval = setInterval(() => {
Swal.getContent().querySelector('b')
.textContent = Swal.getTimerLeft()
}, 2400)
},
onClose: () => {
clearInterval(timerInterval)
}
}).then((result) => {
if (
/* Read more about handling dismissals below */
result.dismiss === Swal.DismissReason.timer
) {
}
});
return false;
}
</script>
<div class="message"></div>
<div class="chat-widget" id="chatWidget">
<!-- chat toggle -->
<input id="chat-widget-toggle" class="chat-widget-toggle" type="checkbox">
<!-- chat close button -->
<label title="close chat" for="chat-widget-toggle" class="chat-widget-button chat-close-button">
<svg xmlns="http://www.w3.org/2000/svg" width="64" version="1.1" height="64" viewBox="0 0 64 64" enable-background="new 0 0 64 64">
<g>
<path fill="#1D1D1B" d="M28.941,31.786L0.613,60.114c-0.787,0.787-0.787,2.062,0,2.849c0.393,0.394,0.909,0.59,1.424,0.59 c0.516,0,1.031-0.196,1.424-0.59l28.541-28.541l28.541,28.541c0.394,0.394,0.909,0.59,1.424,0.59c0.515,0,1.031-0.196,1.424-0.59 c0.787-0.787,0.787-2.062,0-2.849L35.064,31.786L63.41,3.438c0.787-0.787,0.787-2.062,0-2.849c-0.787-0.786-2.062-0.786-2.848,0 L32.003,29.15L3.441,0.59c-0.787-0.786-2.061-0.786-2.848,0c-0.787,0.787-0.787,2.062,0,2.849L28.941,31.786z"/>
</g>
</svg>
</label>
<div class="chat-box">
<!-- chat user info -->
<div class="chat-avatar-box">
<img class="chat-avatar"
src="https://cdn.pixabay.com/photo/2017/08/30/17/27/business-woman-2697954_960_720.jpg" />
</div>
<div class="chat-message-box">
<!-- chat header -->
<div class="chat-header">
<h1 class="chat-title">
<span class="chat-title-primary">Чат Поддержки (тут имя проекта)</span>
<span class="chat-title-sub">Мы ответим Вам в ближайшее время</span>
</h1>
</div>
<!-- chat message -->
<div class="chat-messages">
<div id="chat-messages-content" class="chat-messages-content">
{% if chat_list %}
{% for chat in chat_list %}
<div class="chat-message {{ chat.author_type == 'user' ? '-right' : '-left' }}">
<div class="chat-message-avatar">
<img src="{{ chat.author_type == 'user' ? chat.user.getAvatar() : '/templates/backend/img/support.png' }}" alt="" class="chat-avatar -small">
</div>
<div class="chat-message-text">
{{ processPic(chat.body) }}
</div>
</div>
{% endfor %}
{% else %}
<div class="chat-message-text">
<p class="text-muted text-center">
<br>У вас пока нет сообщений<br>
</p>
</div>
{% endif %}
</div>
</div>
<!-- chat input box -->
<div class="chat-form-box">
<form class="chat-form" id="chat-form ajaxStart" action="" method="post" enctype="multipart/form-data">
<div id="chat__form-inner" class="chat__form-inner">
<span class="input-group-append">
<a href="#" onclick="$('.addfile').slideToggle(); return false;" class=""><i class="fas fa-images"></i></a>
</span>
<textarea id="textInput" type="text" name="body" class="form-control chat-form-input"
placeholder="Введите Ваше сообщение.." required></textarea>
<button id="send" title="send message" onclick="send_supportWidget(); return false;" type="submit" class="chat-form-button">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
width="535.5px" height="535.5px"
viewBox="0 0 535.5 535.5"
style="enable-background:new 0 0 535.5 535.5;">
<polygon points="0,497.25 535.5,267.75 0,38.25 0,216.75 382.5,267.75 0,318.75"/>
</svg>
</button>
</div>
<div class="row addfile" style="margin-top:10px; display:none;">
<div class="col-sm-12">
<div class="form-group" style="text-align: center;">
<input type="file" name="picture" class="" style="">
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- chat open button -->
<label title="open chat" for="chat-widget-toggle" class="chat-widget-button chat-open-button">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 60 60" style="enable-background:new 0 0 60 60;" xml:space="preserve">
<g>
<path d="M54.072,2.535L19.93,2.465c-3.27,0-5.93,2.66-5.93,5.93v3.124l26.065-0.054c4.377,0,7.935,3.557,7.935,7.929v21.142 c0,0.634-0.083,1.248-0.224,1.84l3.484,3.833c0.193,0.213,0.464,0.327,0.74,0.327c0.121,0,0.243-0.021,0.36-0.067 c0.386-0.148,0.64-0.52,0.64-0.933v-10h1.07c3.27,0,5.93-2.66,5.93-5.93V8.465C60,5.195,57.34,2.535,54.072,2.535z" />
<path d="M40.069,13.465L5.93,13.535c-3.27,0-5.93,2.66-5.93,5.93v21.141c0,3.27,2.66,5.93,5.929,5.93H12v10 c0,0.413,0.254,0.784,0.639,0.933c0.118,0.046,0.24,0.067,0.361,0.067c0.276,0,0.547-0.114,0.74-0.327l9.704-10.675l16.626-0.068 c3.27,0,5.93-2.66,5.93-5.93V19.394C46,16.124,43.34,13.465,40.069,13.465z M12,34.449c-2.206,0-4-1.794-4-4s1.794-4,4-4 s4,1.794,4,4S14.206,34.449,12,34.449z M23,34.449c-2.206,0-4-1.794-4-4s1.794-4,4-4s4,1.794,4,4S25.206,34.449,23,34.449z M34,34.449c-2.206,0-4-1.794-4-4s1.794-4,4-4s4,1.794,4,4S36.206,34.449,34,34.449z" />
</g>
</svg>
</label>
</div>
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
У меня есть html форма, я хочу при выборе данных из select что бы загружались данные в textarea
Есть страница на которой выполняется кое-какой скрипт и время его выполнения превышает 10минКак только проходит 10мин, выскакивает ошибка:
Unlike the anyMatch( ) method that returns false when the stream is empty, the allMatch( ) and noneMatch( ) methods return true if the stream is empty!