Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <script src="/static/js/multiplex.js"></script>
- <script type="text/javascript">
- var levels = jQuery.parseJSON('{{ LEVELS|safe }}');
- var level_colors = jQuery.parseJSON('{{ LEVEL_COLORS|safe }}');
- var conn = null;
- var number_of_notifications = 0;
- var channel = null;
- var info_counter = 0;
- var error_counter = 0;
- var complete_counter = 0;
- var tags = [];
- var notification_map = {};
- const LEVEL_INFO = 0;
- const LEVEL_WARNING = 10;
- const LEVEL_ERROR = 20;
- const LEVEL_FAILURE = 30;
- const LEVEL_COMPLETE = 50;
- const send_message = '{"action": "ack_message", "delivery_tag": "dtag"}';
- const count_html = '<div>%d</div>';
- function mark_read(delivery_tag, level)
- {
- channel.send(send_message.replace("dtag", delivery_tag));
- number_of_notifications -= 1;
- tags.splice(tags.indexOf(delivery_tag), 1);
- delete notification_map[delivery_tag];
- var counter = 0;
- var counter_name = '';
- if (level == LEVEL_INFO)
- {
- info_counter -= 1;
- counter = info_counter;
- counter_name = 'info_count';
- }
- if (level == LEVEL_COMPLETE)
- {
- complete_counter -= 1;
- counter = complete_counter;
- counter_name = 'complete_count';
- }
- if (level == LEVEL_ERROR | level == LEVEL_FAILURE)
- {
- error_counter -= 1;
- counter = error_counter;
- counter_name = 'error_count';
- }
- if (counter >=500)
- {
- $('#'+counter_name).empty().append(count_html.replace("%d", ">500"));
- }
- else if (counter)
- {
- $('#'+counter_name).empty().append(count_html.replace("%d", counter));
- }
- else
- {
- $('#'+counter_name).fadeOut('slow');
- }
- }
- $(function() {
- const max_notifications_on_window = 4; // максимальна кількість повідомлень, які одночасно показуються
- const bottom_offset = 10; // відстань від нижнього кряю
- const offset = 25; // відстань між повідомленнями
- const max_message_length = 110; //повідомлення більшої довжини обрізаються
- var on_open_message = '{"action": "new_user", "user_id": {{ user.id }}}';
- var message_html = '<div class="message"> msg </div>';
- function render_notification(id, notification)
- {
- $('#notification_'+id).css({backgroundColor: level_colors[notification.level]});
- $('#notification_'+id).empty().append(levels[notification.level]);
- var message = notification.body;
- if (notification.hasOwnProperty('count'))
- {
- if (notification.count > 0)
- {
- message = message.replace('%d', notification.count);
- }
- }
- if (message.length > max_message_length)
- {
- $('#notification_'+id).css({height: 'auto'});
- //message = message.substr(0, max_message_length) + "<a>...</a>";
- }
- else
- {
- $('#notification_'+id).css({height: '80px'});
- }
- $('#notification_'+id).append(message_html.replace("msg", message));
- set_positions();
- }
- function set_positions()
- {
- var height_sum = 0;
- for (var i = 0; i < max_notifications_on_window; i++)
- {
- $('#notification_'+i).css("bottom", bottom_offset + i * offset + height_sum);
- height_sum += parseInt($('#notification_'+i).css("height"));
- }
- }
- function connect() {
- disconnect();
- channel = multiplexer.channel('notification');
- channel.onopen = function()
- {
- channel.send(on_open_message);
- };
- channel.onmessage = function(e)
- {
- var received_object = jQuery.parseJSON(e.data);
- if (notification_map.hasOwnProperty(received_object.delivery_tag))
- {
- notification_map[received_object.delivery_tag] = received_object;
- tags.splice(tags.indexOf(received_object.delivery_tag) , 1);
- tags.push(received_object.delivery_tag);
- }
- else
- {
- notification_map[received_object.delivery_tag] = received_object;
- tags.push(received_object.delivery_tag);
- var counter = 0;
- var counter_name = '';
- if (level == LEVEL_INFO)
- {
- info_counter += 1;
- counter = info_counter;
- counter_name = 'info_count';
- console.log('info_count: ', counter);
- }
- if (level == LEVEL_COMPLETE)
- {
- complete_counter += 1;
- counter = complete_counter;
- counter_name = 'complete_count';
- console.log('complete_count: ', counter);
- }
- if (level == LEVEL_ERROR | level == LEVEL_FAILURE)
- {
- error_counter += 1;
- counter = error_counter;
- counter_name = 'error_count';
- console.log('error_count: ', counter);
- }
- if (counter == 1)
- {
- $('#'+counter_name).fadeIn('slow');
- }
- if (counter >=500)
- {
- $('#'+counter_name).empty().append(count_html.replace("%d", ">500"));
- }
- else
- {
- $('#'+counter_name).empty().append(count_html.replace("%d", counter));
- }
- }
- };
- channel.onclose = function() {
- channel = null;
- };
- }
- function disconnect() {
- if (channel != null)
- {
- channel.close();
- channel = null;
- }
- }
- for (var i = 0; i < max_notifications_on_window; i++)
- {
- $('#notifications').append($('#notification_number').clone(true).attr({id: "notification_" + i}));
- var height = parseInt($('#notification_'+i).css("height"));
- $('#notification_'+i).css("bottom", bottom_offset + i * (offset + height));
- }
- connect();
- });
- </script>
- <div id="notifications" ></div>
- <div id="notification_number" class="notification"></div>
Add Comment
Please, Sign In to add comment