Merge branch 'ent-10191-nuevas-alertas-sonoras-son-poco-usables' into 'develop'

Ent 10191 nuevas alertas sonoras son poco usables

See merge request artica/pandorafms!5689

pandora_console/include/ajax/events.php

@@ -2406,7 +2406,7 @@ if ($drawConsoleSound === true) {
                 'Star_Trek_emergency_simulation.wav' => 'StarTrek emergency simulation',
             ];
 
-            $eventsounds = mysql_db_get_all_rows_sql('SELECT * FROM tevent_sound WHERE active = 1');
+            $eventsounds = db_get_all_rows_sql('SELECT * FROM tevent_sound WHERE active = 1');
             foreach ($eventsounds as $key => $row) {
                 $sounds[$row['sound']] = $row['name'];
             }

pandora_console/include/functions_ui.php

@@ -1770,7 +1770,7 @@ function ui_require_javascript_file($name, $path='include/javascript/', $echo_ta
 
     if (is_metaconsole()
         && (isset($config['requirements_use_base_url']) === false
-        || $config['requirements_use_base_url'] === false)
+        || $config['requirements_use_base_url'] === false) && $filename !== 'include/javascript/select2.min.js'
     ) {
         $config['js'][$name] = '../../'.$filename;
     } else {

pandora_console/include/javascript/pandora_events.js

@@ -944,8 +944,28 @@ function process_buffers(buffers) {
 }
 
 function openSoundEventModal(settings) {
-  settings = JSON.parse(atob(settings));
+  if ($("#hidden-metaconsole_activated").val() === "1") {
+    var win = open(
+      "../../operation/events/sound_events.php",
+      "day_123",
+      "width=600,height=500"
+    );
+  } else {
+    var win = open(
+      "operation/events/sound_events.php",
+      "day_123",
+      "width=600,height=500"
+    );
+  }
+  if (win) {
+    //Browser has allowed it to be opened
+    win.focus();
+  } else {
+    //Browser has blocked it
+    alert("Please allow popups for this website");
+  }
 
+  settings = JSON.parse(atob(settings));
   // Check modal exists and is open.
   if (
     $("#modal-sound").hasClass("ui-dialog-content") &&
@@ -953,102 +973,6 @@ function openSoundEventModal(settings) {
   ) {
     return;
   }
-
-  // Initialize modal.
-  $("#modal-sound")
-    .empty()
-    .dialog({
-      title: settings.title,
-      resizable: false,
-      modal: true,
-      position: { my: "right top", at: "right bottom", of: window },
-      overlay: {
-        opacity: 0.5,
-        background: "black"
-      },
-      width: 600,
-      height: 600,
-      open: function() {
-        $(".ui-widget-overlay")
-          .css("background", "black")
-          .css("opacity", 0.5);
-        $.ajax({
-          method: "post",
-          url: settings.url,
-          data: {
-            page: settings.page,
-            drawConsoleSound: 1
-          },
-          dataType: "html",
-          success: function(data) {
-            $("#modal-sound").append(data);
-            $("#tabs-sound-modal").tabs({
-              disabled: [1]
-            });
-
-            // Test sound.
-            $("#button-melody_sound").click(function() {
-              var sound = false;
-              if ($("#id_sound_event").length == 0) {
-                sound = true;
-              }
-
-              test_sound_button(sound, settings.urlSound);
-            });
-
-            // Play Stop.
-            $("#button-start-search").click(function() {
-              var mode = $("#hidden-mode_alert").val();
-              var action = false;
-              if (mode == 0) {
-                action = true;
-              }
-
-              action_events_sound(action, settings);
-            });
-
-            // Silence Alert.
-            $("#button-no-alerts").click(function() {
-              if ($("#button-no-alerts").hasClass("silence-alerts") === true) {
-                // Remove audio.
-                remove_audio();
-
-                // Clean events.
-                $("#tabs-sound-modal .elements-discovered-alerts ul").empty();
-                $("#tabs-sound-modal .empty-discovered-alerts").removeClass(
-                  "invisible_important"
-                );
-
-                // Clean progress.
-                $("#progressbar_time").empty();
-
-                // Change img button.
-                $("#button-no-alerts")
-                  .removeClass("silence-alerts")
-                  .addClass("alerts");
-                // Change value button.
-                $("#button-no-alerts").val(settings.noAlert);
-                $("#button-no-alerts > span").text(settings.noAlert);
-
-                // Background button.
-                $(".container-button-alert").removeClass("fired");
-
-                // New progress.
-                listen_event_sound(settings);
-              }
-            });
-          },
-          error: function(error) {
-            console.error(error);
-          }
-        });
-      },
-      close: function() {
-        remove_audio();
-        $(this).dialog("destroy");
-      }
-    })
-    .show();
 }
 
 function test_sound_button(test_sound, urlSound) {

pandora_console/include/styles/sound_events.css

@@ -231,10 +231,6 @@ div.container-button-play > button#button-start-search {
   border: 0;
 }
 
-button#button-start-search:hover {
-  background-position: 82px 14px !important;
-}
-
 .actions-sound-modal .buttons-sound-modal button.alerts,
 .actions-sound-modal .buttons-sound-modal input[type="button"].alerts {
   width: 154px;

pandora_console/operation/events/events.php

@@ -3047,6 +3047,11 @@ $(document).ready( function() {
 
     });
 
+    var show_event_dialog = "<?php echo get_parameter('show_event_dialog', ''); ?>";
+    if (show_event_dialog !== ''){
+        show_event_dialo(show_event_dialog);
+    }
+
     /* Multi select handler */
     $('#checkbox-all_validate_box').on('change', function() {
         if($('#checkbox-all_validate_box').is(":checked")) {
@@ -3291,4 +3296,105 @@ $(document).ready(function () {
 
     $('.white_table_graph_header').first().append($('.filter_summary'));
 });
+
+// Show the modal window of an event
+function show_event_dialo(event, dialog_page) {
+    var ajax_file = getUrlAjax();
+
+    var view = ``;
+
+    if ($("#event_details_window").length) {
+        view = "#event_details_window";
+    } else if ($("#sound_event_details_window").length) {
+        view = "#sound_event_details_window";
+    }
+
+    if (dialog_page == undefined) {
+        dialog_page = "general";
+    }
+
+    try {
+        event = event.replaceAll("&#x20;", "+");
+        event = JSON.parse(atob(event), true);
+    } catch (e) {
+        console.error(e);
+        return;
+    }
+
+    var inputs = $("#events_form :input");
+    var values = {};
+    inputs.each(function() {
+        values[this.name] = $(this).val();
+    });
+
+    // Metaconsole mode flag
+    var meta = $("#hidden-meta").val();
+
+    // History mode flag
+    var history = $("#hidden-history").val();
+
+    jQuery.post(
+        ajax_file,
+        {
+        page: "include/ajax/events",
+        get_extended_event: 1,
+        dialog_page: dialog_page,
+        event: event,
+        meta: meta,
+        history: history,
+        filter: values
+        },
+        function(data) {
+        $(view)
+            .hide()
+            .empty()
+            .append(data)
+            .dialog({
+            title: event.evento,
+            resizable: true,
+            draggable: true,
+            modal: true,
+            minWidth: 875,
+            minHeight: 600,
+            close: function() {
+                $("#refrcounter").countdown("resume");
+                $("div.vc-countdown").countdown("resume");
+            },
+            overlay: {
+                opacity: 0.5,
+                background: "black"
+            },
+            width: 710,
+            height: 650,
+            autoOpen: true,
+            open: function() {
+                if (
+                $.ui &&
+                $.ui.dialog &&
+                $.ui.dialog.prototype._allowInteraction
+                ) {
+                var ui_dialog_interaction =
+                    $.ui.dialog.prototype._allowInteraction;
+                $.ui.dialog.prototype._allowInteraction = function(e) {
+                    if ($(e.target).closest(".select2-dropdown").length)
+                    return true;
+                    return ui_dialog_interaction.apply(this, arguments);
+                };
+                }
+            },
+            _allowInteraction: function(event) {
+                return !!$(event.target).is(".select2-input") || this._super(event);
+            }
+            })
+            .show();
+
+        $("#refrcounter").countdown("pause");
+        $("div.vc-countdown").countdown("pause");
+
+        forced_title_callback();
+        },
+        "html"
+    );
+    return false;
+}
 </script>

pandora_console/operation/events/sound_events.php

@@ -160,29 +160,50 @@ if ($config['style'] === 'pandora_black' && !is_metaconsole()) {
 }
 
 echo '</head>';
-echo "<body class='sound_events'>";
+echo '<body style="overflow: hidden;">';
-echo "<h1 class='modalheaderh1'>".__('Accoustic console').'</h1>';
+echo ui_require_css_file('wizard', 'include/styles/', true);
-
+echo ui_require_css_file('discovery', 'include/styles/', true);
-// Connection lost alert.
+echo ui_require_css_file('sound_events', 'include/styles/', true);
-ui_require_css_file('register', 'include/styles/', true);
+$output = '<div id="tabs-sound-modal">';
-$conn_title = __('Connection with server has been lost');
+    // Header tabs.
-$conn_text = __('Connection to the server has been lost. Please check your internet connection or contact with administrator.');
+    $output .= '<ul class="tabs-sound-modal-options">';
-ui_require_javascript_file('connection_check');
+        $output .= '<li>';
-set_js_value('absolute_homeurl', ui_get_full_url(false, false, false, false));
+        $output .= '<a href="#tabs-sound-modal-1">';
-ui_print_message_dialog(
+        $output .= html_print_image(
-    $conn_title,
+            'images/gear.png',
-    $conn_text,
+            true,
-    'connection',
+            [
-    '/images/fail@svg.svg'
+                'title' => __('Options'),
+                'class' => 'invert_filter',
+            ]
         );
+        $output .= '</a>';
+        $output .= '</li>';
+        $output .= '<li>';
+        $output .= '<a href="#tabs-sound-modal-2">';
+        $output .= html_print_image(
+            'images/list.png',
+            true,
+            [
+                'title' => __('Events list'),
+                'class' => 'invert_filter',
+            ]
+        );
+        $output .= '</a>';
+        $output .= '</li>';
+        $output .= '</ul>';
 
+        // Content tabs.
+        $output .= '<div id="tabs-sound-modal-1">';
+        $output .= '<h3 class="console-configuration">';
+        $output .= __('Console configuration');
+        $output .= '</h3>';
         $inputs = [];
 
         // Load filter.
         $fields = \events_get_event_filter_select();
         $inputs[] = [
-    'label'     => \__('Load filter'),
+            'label'     => \__('Set condition'),
-    'class'     => 'flex-row',
             'arguments' => [
                 'type'          => 'select',
                 'fields'        => $fields,
@@ -212,7 +233,7 @@ $times_sound = [
         ];
 
         $inputs[] = [
-    'class'         => 'flex-row flex-row-center',
+            'class'         => 'interval-sounds',
             'direct'        => 1,
             'block_content' => [
                 [
@@ -226,7 +247,7 @@ $inputs[] = [
                     ],
                 ],
                 [
-            'label'     => __('Time Sound'),
+                    'label'     => __('Sound duration'),
                     'arguments' => [
                         'type'     => 'select',
                         'fields'   => $times_sound,
@@ -252,14 +273,17 @@ $sounds = [
             'Star_Trek_emergency_simulation.wav' => 'StarTrek emergency simulation',
         ];
 
-$eventsounds = mysql_db_get_row_sql('SELECT * FROM tevent_sound WHERE active = 1');
+        $eventsounds = db_get_all_rows_sql('SELECT * FROM tevent_sound WHERE active = 1');
         foreach ($eventsounds as $key => $row) {
             $sounds[$row['sound']] = $row['name'];
         }
 
         $inputs[] = [
-    'label'     => \__('Sounds'),
+            'class'         => 'test-sounds',
-    'class'     => 'flex-row',
+            'direct'        => 1,
+            'block_content' => [
+                [
+                    'label'     => \__('Sound melody'),
                     'arguments' => [
                         'type'     => 'select',
                         'fields'   => $sounds,
@@ -268,10 +292,21 @@ $inputs[] = [
                         'return'   => true,
                         'class'    => 'fullwidth',
                     ],
+                ],
+                [
+                    'arguments' => [
+                        'type'       => 'button',
+                        'name'       => 'melody_sound',
+                        'label'      => __('Test sound'),
+                        'attributes' => ['icon' => 'sound'],
+                        'return'     => true,
+                    ],
+                ],
+            ],
         ];
 
         // Print form.
-HTML::printForm(
+        $output .= HTML::printForm(
             [
                 'form'   => [
                     'action' => '',
@@ -279,196 +314,321 @@ HTML::printForm(
                 ],
                 'inputs' => $inputs,
             ],
-    false,
+            true,
+            false
+        );
+        $output .= '</div>';
+
+        $output .= '<div id="tabs-sound-modal-2">';
+        $output .= '<h3 class="title-discovered-alerts">';
+        $output .= __('Discovered alerts');
+        $output .= '</h3>';
+        $output .= '<div class="empty-discovered-alerts">';
+        $output .= html_print_image(
+            'images/no-alerts-discovered.png',
+            true,
+            [
+                'title' => __('No alerts discovered'),
+                'class' => 'invert_filter',
+            ]
+        );
+        $output .= '<span class="text-discovered-alerts">';
+        $output .= __('Congrats! there’s nothing to show');
+        $output .= '</span>';
+        $output .= '</div>';
+        $output .= '<div class="elements-discovered-alerts"><ul></ul></div>';
+        $output .= html_print_input_hidden(
+            'ajax_file_sound_console',
+            ui_get_full_url('ajax.php', false, false, false),
             true
         );
-
+        $output .= html_print_input_hidden(
-$result = '<div><ul class="events_fired">';
+            'meta',
-$result .= '<li class="events_fired_li_empty">';
+            is_metaconsole(),
-$result .= ui_print_info_message(__('Events not found'), '', true);
+            true
-$result .= '</li>';
-$result .= '</ul></div>';
-
-$result .= '<div id="progressbar_time"></div>';
-
-echo $result;
-
-$table = new StdClass;
-$table->width = '100%';
-$table->class = 'sound_div_background text_center';
-
-$table->data[0][0] = '<a href="javascript: toggleButton();">';
-$table->data[0][0] .= html_print_image(
-    'images/play.button.png',
-    true,
-    ['id' => 'button']
         );
-$table->data[0][0] .= '</a>';
+        $output .= '<div id="sound_event_details_window"></div>';
+        $output .= '<div id="sound_event_response_window"></div>';
+        $output .= '</div>';
+        $output .= '</div>';
 
-$table->data[0][1] = '<a href="javascript: ok();">';
+        $output .= '<div class="actions-sound-modal">';
-$table->data[0][1] .= html_print_image(
+        $output .= '<div id="progressbar_time"></div>';
-    'images/ok.button.png',
+        $output .= '<div class="buttons-sound-modal mrgn_top_10px">';
-    true,
+        $output .= html_print_button(
-    ['style' => 'margin-left: 15px;']
+            __('Start'),
-);
+            'start-search',
-$table->data[0][1] .= '</a>';
+            false,
-
+            '',
-$table->data[0][2] = '<a href="javascript: test_sound_button();">';
-$table->data[0][2] .= html_print_image(
-    'images/icono_test.png',
-    true,
             [
-        'id'    => 'button_try',
+                'icon'  => 'cog',
-        'style' => 'margin-left: 15px;',
+                'class' => 'mrgn_lft_20px',
-    ]
+            ],
+            true
         );
-$table->data[0][2] .= '</a>';
+        // $output .= html_print_submit_button(
-
+        // [
-$table->data[0][3] = html_print_image(
+        // 'label'      => __('Start'),
-    'images/tick_sound_events.png',
+        // 'type'       => 'button',
-    true,
+        // 'name'       => 'start-search',
+        // 'attributes' => [ 'class' => 'play' ],
+        // 'return'     => true,
+        // ],
+        // 'div',
+        // true
+        // );
+        $output .= '<div class="container-button-alert mrgn_right_20px">';
+        $output .= html_print_input(
             [
-        'id'    => 'button_status',
+                'type'       => 'button',
-        'style' => 'margin-left: 15px;',
+                'name'       => 'no-alerts',
-    ]
+                'label'      => __('No alerts'),
+                'attributes' => ['class' => 'secondary alerts'],
+                'return'     => true,
+            ],
+            'div',
+            true
         );
+        $output .= '</div>';
 
-html_print_table($table);
+        $output .= html_print_input(
+            [
+                'type'   => 'hidden',
+                'name'   => 'mode_alert',
+                'value'  => 0,
+                'return' => true,
+            ],
+            'div',
+            true
+        );
+        $output .= '</div>';
+        $output .= '</div>';
+        echo $output;
         ?>
 
 <script type="text/javascript">
-var control = false;
 
-var running = false;
+function test_sound_button(test_sound, urlSound) {
-var id_row = 0;
+    if (test_sound === true) {
-var button_play_status = "play";
+        $("#button-melody_sound").addClass("blink-image");
-var test_sound = false;
+        add_audio(urlSound);
-
-function test_sound_button() {
-    if (!test_sound) {
-        $("#button_try").attr('src', '../../images/icono_test.png');
-        var sound = '../../include/sounds/' + $('#sound_id').val();
-        $('body').append("<audio src='"+sound+"' autoplay='true' hidden='true' loop='false'>");
-        test_sound = true;
     } else {
-        $("#button_try").attr('src', '../../images/icono_test.png');
+        $("#button-melody_sound").removeClass("blink-image");
-        $('body audio').remove();
+        remove_audio();
-        test_sound = false;
     }
 }
 
-function toggleButton() {
+function action_events_sound(mode) {
-    if (button_play_status == 'pause') {
+    if (mode === true) {
-        $("#button").attr('src', '../../images/play.button.png');
+        // Enable tabs.
-        stopSound();
+        $("#tabs-sound-modal").tabs("option", "disabled", [0]);
-        control.paused();
+        // Active tabs.
+        $("#tabs-sound-modal").tabs("option", "active", 1);
+        // Change mode.
+        $("#hidden-mode_alert").val(1);
+        // Change img button.
+        $("#button-start-search")
+        .removeClass("play")
+        .addClass("stop");
+        // Change value button.
+        $("#button-start-search").val("Stop");
+        $("#button-start-search > span").text("Stop");
+        // Add Progress bar.
+        listen_event_sound();
+    } else {
+        // Enable tabs.
+        $("#tabs-sound-modal").tabs("option", "disabled", [1]);
+        // Active tabs.
+        $("#tabs-sound-modal").tabs("option", "active", 0);
+        // Change mode.
+        $("#hidden-mode_alert").val(0);
+        // Change img button.
+        $("#button-start-search")
+        .removeClass("stop")
+        .addClass("play");
+        // Change value button.
+        $("#button-start-search").val("Start");
+        $("#button-start-search > span").text("Start");
+        // Remove progress bar.
+        $("#progressbar_time").empty();
+        // Remove audio.
+        remove_audio();
+        // Clean events.
+        $("#tabs-sound-modal .elements-discovered-alerts ul").empty();
+        $("#tabs-sound-modal .empty-discovered-alerts").removeClass(
+        "invisible_important"
+        );
+        // Change img button.
+        $("#button-no-alerts")
+        .removeClass("silence-alerts")
+        .addClass("alerts");
+        // Change value button.
+        $("#button-no-alerts").val("No alert");
+        $("#button-no-alerts > span").text("No alert");
 
-        button_play_status = 'play';
+        // Background button.
-    }
+        $(".container-button-alert").removeClass("fired");
-    else {
-        $("#button").attr('src', '../../images/pause.button.png');
-        forgetPreviousEvents();
-        startSound();
-
-        button_play_status = 'pause';
     }
 }
 
-function ok() {
+function add_audio(urlSound) {
-    $('#button_status').attr('src','../../images/tick_sound_events.png');
+    var sound = urlSound;
-    $('audio').remove();
+    $(".actions-sound-modal").append(
-    $('.events_fired').empty();
+        "<audio id='id_sound_event' src='" +
+        sound +
+        "' autoplay='true' hidden='true' loop='false'>"
+    );
 }
 
-function stopSound() {
+function remove_audio() {
-    $('audio').remove();
+    $(".actions-sound-modal audio").remove();
-    $('body').css('background', '#494949');
-    running = false;
 }
 
-function startSound() {
+function listen_event_sound() {
-    running = true;
+    progressTimeBar(
-}
-
-function forgetPreviousEvents() {
-    if(control === false) {
-        running = true;
-        control = progressTimeBar(
         "progressbar_time",
         $("#interval").val(),
-            'infinite',
+        "infinite",
         function() {
-                check_event();
+        // Search events.
+        check_event_sound();
         }
     );
-    } else {
-        control.start();
-    }
 }
 
-function check_event() {
+function check_event_sound() {
-    if (running) {
+    jQuery.post(
-        var sound = '../../include/sounds/' + $('#sound_id').val();
+        $('#hidden-ajax_file_sound_console').val(),
-        jQuery.post ("../../ajax.php",
         {
-                "page" : "include/ajax/events",
+        page: "include/ajax/events",
-                "get_events_fired": 1,
+        get_events_fired: 1,
-                "filter_id": $('#filter_id').val(),
+        filter_id: $("#tabs-sound-modal #filter_id").val(),
-                "interval": $('#interval').val(),
+        interval: $("#tabs-sound-modal #interval").val(),
-                "time_sound": $('#time_sound').val(),
+        time_sound: $("#tabs-sound-modal #time_sound").val()
         },
         function(data) {
             if (data != false) {
-                    $('.events_fired_li_empty').remove();
+                // Hide empty.
-
+                $("#tabs-sound-modal .empty-discovered-alerts").addClass(
-                    $('#button_status')
+                "invisible_important"
-                        .attr(
-                            'src','../../images/sound_events_console_alert.gif'
-                        );
-                    $('audio').remove();
-
-                    $('body')
-                        .append(
-                            "<audio id='audio-boom' src='" + sound + "' autoplay='true' hidden='true' loop='true' >"
                 );
 
+                // Change img button.
+                $("#button-no-alerts")
+                .removeClass("alerts")
+                .addClass("silence-alerts");
+                // Change value button.
+                $("#button-no-alerts").val("Silence alarm");
+                $("#button-no-alerts > span").text("Silence alarm");
+
+                // Background button.
+                $(".container-button-alert").addClass("fired");
+
+                // Remove audio.
+                remove_audio();
+                var urlSound = '../../include/sounds/'+$('#sound_id :selected').val();
+                // Apend audio.
+                add_audio(urlSound);
+
+                // Add elements.
                 data.forEach(function(element) {
-                        var li = document.createElement('li');
+                var li = document.createElement("li");
+                var b64 = btoa(JSON.stringify(element));
                 li.insertAdjacentHTML(
-                            'beforeend',
+                    "beforeend",
-                            '<div class="flex0">'+element.priority+'</div>'
+                    '<div class="li-priority">' + element.priority + "</div>"
                 );
                 li.insertAdjacentHTML(
-                            'beforeend',
+                    "beforeend",
-                            '<div class="flex0">'+element.type+'</div>'
+                    '<div class="li-type">' + element.type + "</div>"
                 );
                 li.insertAdjacentHTML(
-                            'beforeend',
+                    "beforeend",
-                            '<div class="mess">'+element.message+'</div>'
+                    `<div class="li-title"><a href="javascript:" onclick="open_window_dialog('`+b64+`')">${element.message}</a></div>`
                 );
                 li.insertAdjacentHTML(
-                            'beforeend',
+                    "beforeend",
-                            '<div class="flex-time">'+element.timestamp+'</div>'
+                    '<div class="li-time">' + element.timestamp + "</div>"
                 );
-                        $('.events_fired').append(li);
+                $("#tabs-sound-modal .elements-discovered-alerts ul").append(li);
                 });
 
-                    function removeAudio() {
-                        $('audio').remove();
-                    }
-
                 // -100 delay sound.
                 setTimeout(
-                        removeAudio,
+                remove_audio,
-                        (parseInt($('#time_sound').val())  * 1000) - 100
+                parseInt($("#tabs-sound-modal #time_sound").val()) * 1000 - 100
                 );
             }
         },
         "json"
     );
 }
+
+function open_window_dialog(data) {
+    window.open(window.location.origin+'/pandora_console/index.php?sec=eventos&sec2=operation/events/events&show_event_dialog='+data);
+    //show_event_dialog(data);
 }
 
+$(document).ready(function(){
+
+    $("#tabs-sound-modal").tabs({
+        disabled: [1]
+    });
+
+    // Test sound.
+    $("#button-melody_sound").click(function() {
+        var sound = false;
+        if ($("#id_sound_event").length == 0) {
+            sound = true;
+        }
+        var urlSound = '../../include/sounds/'+$('#sound_id :selected').val();
+
+        test_sound_button(sound, urlSound);
+    });
+
+    // Play Stop.
+    $("#button-start-search").click(function() {
+        var mode = $("#hidden-mode_alert").val();
+        var action = false;
+        if (mode == 0) {
+            action = true;
+        }
+
+        action_events_sound(action);
+    });
+
+    // Silence Alert.
+    $("#button-no-alerts").click(function() {
+        if ($("#button-no-alerts").hasClass("silence-alerts") === true) {
+        // Remove audio.
+        remove_audio();
+
+        // Clean events.
+        $("#tabs-sound-modal .elements-discovered-alerts ul").empty();
+        $("#tabs-sound-modal .empty-discovered-alerts").removeClass(
+            "invisible_important"
+        );
+
+        // Clean progress.
+        $("#progressbar_time").empty();
+
+        // Change img button.
+        $("#button-no-alerts")
+            .removeClass("silence-alerts")
+            .addClass("alerts");
+        // Change value button.
+        $("#button-no-alerts").val("No alert");
+        $("#button-no-alerts > span").text("No alert");
+
+        // Background button.
+        $(".container-button-alert").removeClass("fired");
+
+        // New progress.
+        listen_event_sound();
+        }
+    });
+});
+
 </script>
 
 <?php