Guest User

Untitled

a guest
Jul 22nd, 2018
93
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
Python 7.07 KB | None | 0 0
  1. <script src="/static/js/multiplex.js"></script>
  2. <script type="text/javascript">
  3.     var levels = jQuery.parseJSON('{{ LEVELS|safe }}');
  4.     var level_colors = jQuery.parseJSON('{{ LEVEL_COLORS|safe }}');
  5.  
  6.     var conn = null;
  7.     var number_of_notifications = 0;
  8.     var channel = null;
  9.     var info_counter = 0;
  10.     var error_counter = 0;
  11.     var complete_counter = 0;
  12.     var tags = [];
  13.     var notification_map = {};
  14.  
  15.     const LEVEL_INFO = 0;
  16.     const LEVEL_WARNING = 10;
  17.     const LEVEL_ERROR = 20;
  18.     const LEVEL_FAILURE = 30;
  19.     const LEVEL_COMPLETE = 50;
  20.  
  21.     const send_message = '{"action": "ack_message", "delivery_tag": "dtag"}';
  22.     const count_html = '<div>%d</div>';
  23.  
  24.  
  25.     function mark_read(delivery_tag, level)
  26.     {
  27.         channel.send(send_message.replace("dtag", delivery_tag));
  28.         number_of_notifications -= 1;
  29.  
  30.         tags.splice(tags.indexOf(delivery_tag), 1);
  31.  
  32.         delete notification_map[delivery_tag];
  33.  
  34.         var counter = 0;
  35.         var counter_name = '';
  36.  
  37.         if (level == LEVEL_INFO)
  38.         {
  39.             info_counter -= 1;
  40.             counter = info_counter;
  41.             counter_name = 'info_count';
  42.         }
  43.         if (level == LEVEL_COMPLETE)
  44.         {
  45.             complete_counter -= 1;
  46.             counter = complete_counter;
  47.             counter_name = 'complete_count';
  48.         }
  49.         if (level == LEVEL_ERROR | level == LEVEL_FAILURE)
  50.         {
  51.             error_counter -= 1;
  52.             counter = error_counter;
  53.             counter_name = 'error_count';
  54.         }
  55.  
  56.         if (counter >=500)
  57.         {
  58.             $('#'+counter_name).empty().append(count_html.replace("%d", ">500"));
  59.         }
  60.         else if (counter)
  61.         {
  62.             $('#'+counter_name).empty().append(count_html.replace("%d", counter));
  63.         }
  64.         else
  65.         {
  66.             $('#'+counter_name).fadeOut('slow');
  67.         }
  68.  
  69.     }
  70.  
  71.  
  72.     $(function() {
  73.  
  74.         const max_notifications_on_window = 4; // максимальна кількість повідомлень, які одночасно показуються
  75.         const bottom_offset = 10; // відстань від нижнього кряю
  76.         const offset = 25; // відстань між повідомленнями
  77.         const max_message_length = 110; //повідомлення більшої довжини обрізаються
  78.  
  79.  
  80.  
  81.         var on_open_message = '{"action": "new_user", "user_id": {{ user.id }}}';
  82.         var message_html = '<div class="message"> msg </div>';
  83.  
  84.  
  85.  
  86.         function render_notification(id, notification)
  87.         {
  88.             $('#notification_'+id).css({backgroundColor: level_colors[notification.level]});
  89.             $('#notification_'+id).empty().append(levels[notification.level]);
  90.  
  91.             var message = notification.body;
  92.             if (notification.hasOwnProperty('count'))
  93.             {
  94.                 if (notification.count > 0)
  95.                 {
  96.                     message = message.replace('%d', notification.count);
  97.                 }
  98.             }
  99.  
  100.             if (message.length > max_message_length)
  101.             {
  102.                 $('#notification_'+id).css({height: 'auto'});
  103.                 //message = message.substr(0, max_message_length) + "<a>...</a>";
  104.             }
  105.             else
  106.             {
  107.                 $('#notification_'+id).css({height: '80px'});
  108.             }
  109.  
  110.             $('#notification_'+id).append(message_html.replace("msg", message));
  111.             set_positions();
  112.         }
  113.  
  114.         function set_positions()
  115.         {
  116.             var height_sum = 0;
  117.             for (var i = 0; i < max_notifications_on_window; i++)
  118.             {
  119.                 $('#notification_'+i).css("bottom", bottom_offset + i * offset + height_sum);
  120.                 height_sum += parseInt($('#notification_'+i).css("height"));
  121.             }
  122.         }
  123.  
  124.  
  125.  
  126.         function connect() {
  127.             disconnect();
  128.  
  129.             channel = multiplexer.channel('notification');
  130.             channel.onopen = function()
  131.             {
  132.                 channel.send(on_open_message);
  133.             };
  134.  
  135.             channel.onmessage = function(e)
  136.             {
  137.                 var received_object = jQuery.parseJSON(e.data);
  138.  
  139.                 if (notification_map.hasOwnProperty(received_object.delivery_tag))
  140.                 {
  141.                     notification_map[received_object.delivery_tag] = received_object;
  142.  
  143.                     tags.splice(tags.indexOf(received_object.delivery_tag) , 1);
  144.                     tags.push(received_object.delivery_tag);
  145.  
  146.                 }
  147.                 else
  148.                 {
  149.                     notification_map[received_object.delivery_tag] = received_object;
  150.                     tags.push(received_object.delivery_tag);
  151.  
  152.                     var counter = 0;
  153.                     var counter_name = '';
  154.  
  155.                     if (level == LEVEL_INFO)
  156.                     {
  157.                         info_counter += 1;
  158.                         counter = info_counter;
  159.                         counter_name = 'info_count';
  160.                         console.log('info_count: ', counter);
  161.                     }
  162.                     if (level == LEVEL_COMPLETE)
  163.                     {
  164.                         complete_counter += 1;
  165.                         counter = complete_counter;
  166.                         counter_name = 'complete_count';
  167.                         console.log('complete_count: ', counter);
  168.                     }
  169.                     if (level == LEVEL_ERROR | level == LEVEL_FAILURE)
  170.                     {
  171.                         error_counter += 1;
  172.                         counter = error_counter;
  173.                         counter_name = 'error_count';
  174.                         console.log('error_count: ', counter);
  175.                     }
  176.  
  177.                     if (counter == 1)
  178.                     {
  179.                         $('#'+counter_name).fadeIn('slow');
  180.                     }
  181.  
  182.                     if (counter >=500)
  183.                     {
  184.                         $('#'+counter_name).empty().append(count_html.replace("%d", ">500"));
  185.                     }
  186.                     else
  187.                     {
  188.                         $('#'+counter_name).empty().append(count_html.replace("%d", counter));
  189.                     }
  190.  
  191.                 }
  192.  
  193.             };
  194.  
  195.             channel.onclose = function() {
  196.                 channel = null;
  197.             };
  198.         }
  199.  
  200.         function disconnect() {
  201.             if (channel != null)
  202.             {
  203.                 channel.close();
  204.                 channel = null;
  205.             }
  206.         }
  207.  
  208.  
  209.         for (var i = 0; i < max_notifications_on_window; i++)
  210.         {
  211.             $('#notifications').append($('#notification_number').clone(true).attr({id: "notification_" + i}));
  212.             var height = parseInt($('#notification_'+i).css("height"));
  213.             $('#notification_'+i).css("bottom", bottom_offset + i * (offset + height));
  214.         }
  215.  
  216.         connect();
  217.  
  218.     });
  219.  
  220. </script>
  221.  
  222. <div id="notifications" ></div>
  223.  
  224. <div id="notification_number" class="notification"></div>
Add Comment
Please, Sign In to add comment