[Решено] Изменить jGrowl-уведомления в minishop2

Доброго времени суток.
Возникла необходимость в изменении текста jGrowl-уведомлений, всплывающих при добавлении товара в корзину.
Хотел бы убрать количество в уведомлении, чтобы просто выводились сообщения о добавлении товара.
Предполагаю, что нужно где-то здесь копать, но не смог разобраться где конкретно.

Заранее благодарен.

Алексей

02 ноября 2015, 19:32

9 472

Комментарии: 23

Максим Кузнецов Проверенный

02 ноября 2015, 22:37

Вы можете просто очистить запись (не удалять, а заменить на пустую строку) в управлении лексиконами, чтобы убрать нужное сообщение.

Управление словарями:
Пространство имен — minishop2
Тема — cart
Язык — ru
Запись — ms2_cart_change_success

Алексей Старожил

03 ноября 2015, 08:48

Спасибо. Поправил, где мне было нужно.

Константин Старожил

13 июля 2017, 08:55

А подскажите, как это уведомление можно стилизовать?

Павел Гвоздь Эксперт

13 июля 2017, 09:37

Возможно, при помощи CSS?))

Алексей Шумаев Проверенный

13 июля 2017, 11:06

Можно как угодно менять.
Как вариант, я вообще отключаю и делаю свой вывод сообщений в модальном окне, примерно так:
1) копируем штатный скрипт из assets/components/minishop2/js/web/default.js в assets/components/minishop2/js/web/custom.js
2) переключаем в настройках системы параметр ms2_frontend_js на новый скрипт
3) переписываем метод miniShop2.Message в скрипте на свой, например как-то так:

....
 miniShop2.Message.show = function (message) {
                if (message != '') {
                     $('#modalMessageContent').html(message);
			$('#modalMessage').modal();
                }
            };
...

Всё, что касается jGrowl в этом методе нужно в этом случае закомментировать/удалить.

Также можно обойтись без кастомизации метода: просто закомментить jGrowl в своём скрипте и использовать callbacks. Например в своём скрипте на фронтенде:

if (typeof(miniShop2) != 'undefined') { 
        miniShop2.Callbacks.Cart.add.response.success = function(response) {
            if (response.success) {
	    		console.log('cart:add');
	    	}
        }
   
        miniShop2.Callbacks.Cart.change.response.success = function(response) {
	    	if (response.success) {
	    		console.log('cart:change');
	    	}
	    };
	    
	     miniShop2.Callbacks.Cart.remove.response.success = function(response) {
	        if (response.success) {
	            console.log('cart:remove');
	        }
	     };
    }

Все данные находятся в response.

Василий Наумкин Администратор

13 июля 2017, 11:46

Гораздо проще и лучше просто вызвать свой скрипт после default.js от ms2 и перезаписать там объект miniShop2.Message:

miniShop2.Message = {
	success: function() {},
	error: function() {},
	info: function() {},
};

В modstore.pro, например, сделано вообще вот так:

miniShop2.Message = App.utils.Message;

Поэтому все уведомления от ms2 работают через общую систему уведомлений сайта.

~~Сергей~~ Старожил

08 августа 2017, 12:08

а как вызывать свой скрипт после default.js от ms2?

Василий Наумкин Администратор

08 августа 2017, 17:12

$(doсument).on('ready', function() {
	miniShop2.Message = {
		success: function() {},
		error: function() {},
		info: function() {},
	};
});

Я не имел в виду, что нужно прям свой файл загрузить после, хотя и так можно. Нужно просто перезаписать часть скрипта miniShop2 перед его первым использованием.

Николай Савин Администратор

08 августа 2017, 12:55

Вот мне тоже интересно. А как правильно вызвать свой скрипт, после подключения default.js?
Ну в голову конечно приходит вариант, отключить автовызов default.js в системных настройках, и последовательно подключить нужные скрипты вручную перед body.
А есть более правильный способ с автовызовом default.js?

~~Сергей~~ Старожил

08 августа 2017, 13:01

Я пока что юзаю такую методу — переименовал default.js в custom.js, соответственно поправил системные настройки, а нужные мне функции дописываю в конце файла. Все работает. Немного непонятен совет Василия сделать отдельный скрипт. Добавить еще один запрос к серверу? ЗАЧЕМ? На случай обновления? Клиент сам обновлять плагины не будет, а я уж как-нибудь через WinMerge найду края))) Только если для случая продвинутого клиента? Таких клиентов стараюсь не заводить)))

Николай Савин Администратор

08 августа 2017, 13:07

Что такое WinMerge?

~~Сергей~~ Старожил

08 августа 2017, 13:49

Сравнение файлов. winmerge.org

~~Сергей~~ Старожил

08 августа 2017, 20:14

Нюанс еще и в том, что убирая эти зеленые уведомления, желательно убирать также подключение одного файла скрипта и одного файла стилей! Себе закомментил в custom.js все, что связано с зеленью — вуаля, минус два запроса к серверу!

АндрейЧ Старожил

12 ноября 2017, 11:49

Добрый день. Научите пожалуйста как создать собственное уведомление.
У меня есть кнопка, хочу к ней прикрепить новое уведомление, мол товара нет в наличии.

<button type="submit" name="ms2_action" id="addto-cart" class="le-button huge unavailability">[[%ms2_cart_unavailability]]</button>

АндрейЧ Старожил

13 ноября 2017, 17:08

Добрый день, объясните пожалуйста в теории как получается уведомление: «Товар успешно добавлен в корзину: 1»
Хочу отследить цепочку, разобраться.)

1. Я нажимаю кнопку «Добавить в корзину»

<button type="submit" name="ms2_action" value="cart/add" id="addto-cart" class="le-button huge">[[%ms2_frontend_add_to_cart]]</button>

2.
3.
?

N. Появляется уведомление «Товар успешно добавлен в корзину: 1»

Волков Николай Старожил

13 ноября 2017, 17:56

Вот собственно о чем я и говорил: народ не знает JavaScript. Прошу любить и жаловать: одна из красот JavaScript «Monkey Patching». Этот код можно выполнить в консоли браузера, к примеру на minishop2.com

(function(miniShop2, $){
	var message = miniShop2.Message.show; 

	miniShop2.Message.show = function() {
		alert('Хе хе хе!');
	}

	$.extend(miniShop2.Message.show, message.prototype);
})(miniShop2, jQuery);

Пример не более чем просто показательный и не убирает проблемы подключения не нужных скриптов и т.д. Но на самом деле это достаточно просто делается, правда на выходе код будет не столь «лаконичен» :-)

Волков Николай Старожил

13 ноября 2017, 18:24

P.S. Я случайно ошибку допустил, но в этом примере она никак не проявится. Хотел исправить сначала, но потом подумал, что оно и к лучшему :-) Прототипы детям не игрушка ;-Р

АндрейЧ Старожил

14 ноября 2017, 17:14

Николай, спасибо, в вашем примере я разобрался, попробывал в консоли, работает как Alert с текстом Хе хе хе, когда добавляю товар в корзину…

Если знаете, дайте пожалуйста ссылку на урок или статью, чтобы я смог свое личное персональное JGrowl оповещение создать… Зеленое такое… Или в гугле, что именно поискать и сделать…?

Хочу разобраться в MS2… что происходит от нажатия на кнопку «В корзину» до появления JGrowl оповещения…

АндрейЧ Старожил

14 ноября 2017, 17:49

Вобщем интересно, как к любой кнопке привязать Jgrowl через стандартные методы MS2 или еще как либо.
Запись в словарь я добавил — ms2_cart_unavailability (Товара нет)
А дальше пока не разобрался

Волков Николай Старожил

14 ноября 2017, 18:35

Более прозрачный намек

(function(miniShop2, $){
	var message = miniShop2.Message.show; 

	miniShop2.Message.show = function() {
		console.log("Тут код своего JGrowl");
	}

	$.extend(miniShop2.Message.show.prototype, message.prototype);
})(miniShop2, jQuery);

АндрейЧ Старожил

18 ноября 2017, 13:41

Очень прозрачный намек) То что надо. Спасибо! Научился кое-чему… Многому!
И сорри что я тут в JS пытаюсь разобраться)

Пока не получается привязать ваш код кнопке (второй блок кода) и Jgrowl — не стандартные, черные )
Как по-хорошему добавить свой Jgrowl-текст в минишоп пока не разобрался, но в следующий раз будет легче.

[[!+availability:el=`0`:then=`<button onclick="(miniShop2, $)" type="submit" name="ms2_action" id="addto-cart" class="le-button huge unavailability">[[%ms2_cart_unavailability]]</button>`:else=`<button type="submit" name="ms2_action" value="cart/add" id="addto-cart" class="le-button huge">[[%ms2_frontend_add_to_cart]]</button>`]]

<script>
(function(miniShop2, $){
	var message = miniShop2.Message.show; 

	miniShop2.Message.show = function() {
		$.jGrowl("Товара нет. Спросите дату поступления у менеджера");
	}

	$.extend(miniShop2.Message.show.prototype, message.prototype);
})(miniShop2, jQuery);
</script>

+ Ошибки думаю мои, уверен.

Uncaught TypeError: Cannot read property 'show' of undefined

Волков Николай Старожил

21 ноября 2017, 01:18

Прости меня, Господи, это что за ?%:%;

onclick="(miniShop2, $)"

Для того, чтобы понять смысл подобных конструкций:

(function(){...})()

Почитайте, что такое AMD в JS.

Волков Николай Старожил

21 ноября 2017, 01:23

Ошибка из-за того, что все это дело нужно обернуть еще раз:

(function(miniShop2, $){
	$(function(){
		var message = ....
		...
		...
	});
})(miniShop2, jQuery)

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

[Решено] Изменить jGrowl-уведомления в minishop2

Job Piper собирает IT заказы со всего Интернета.

Комментарии: 23