Grafana: [Permintaan FITUR] Putar Suara saat aktivasi peringatan

dimana masalahnya? Cukup tambahkan sendiri webhook untuk memutar suara menggunakan fitur peringatan webhook ;)

@flyersa

hei terbang,
tidak pernah bekerja dengan webhook sebelumnya. ada saran harus mulai dari mana? :)

tolong tunjukkan saya beberapa contoh jika Anda memutar suara

+1 untuk fungsionalitas di luar kotak untuk suara pada peringatan baru di browser

+1 Saya harap begitu juga

+1

Ini akan sangat membantu

Saya pikir itu akan menjadi fungsi yang baik juga. Karena saya sangat membutuhkannya saat ini. 🤣 🤣 🤣

apakah fungsi play sound sudah diimplementasikan?

Tolong terapkan ini!!!!!

+1

+1

+1

+1

Setelah beberapa diskusi internal, kami sepakat bahwa ini bukan sesuatu yang ingin kami dukung di core Grafana. Tetapi karena Grafana memiliki dukungan untuk plugin panel, dimungkinkan untuk mengembangkan plugin baru yang memperluas panel daftar peringatan atau plugin baru untuk memainkan suara peringatan.

Tapi Anda mendukung Alerts! Seberapa sulit memainkan .wav saat panel berkedip?

Saya pikir dia ada benarnya, itu harus didukung di panel, dan saya pikir itu yang kami minta, bukan inti Grafana tetapi panel. Sebagian besar dari kita tetap menggunakan panel default.

Kami juga membutuhkannya! +1

@bergquist bagaimana kalau memperingatkan menggunakan pemberitahuan desktop kapan?

BUKA KEMBALI Permintaan fitur. Tahun baru, mata segar. Tolong.

+1

+1

+1

+1
fitur yang pasti diinginkan,
mungkin ekstensi Grafana Alerting API dengan kombinasi POST webhook akan menjadi pendekatan yang baik?

+1
Ketika dasbor Grafana diproyeksikan di Ruang Kontrol, NOC, SOC.... bersama dengan Monitor lain, sangat berharga untuk memiliki suara saat peringatan Grafana terjadi.

+1 menerapkan ini. saya menjalankan grafana pada sistem pemantauan dinding video yang kritis. peringatan yang mendorong saya untuk melihat ke dinding akan sangat membantu dalam waktu respons!

+1
Ini akan menjadi fitur yang sangat berguna

+1 juga menurut perusahaan kami adalah fitur yang sangat bagus untuk dikembangkan dan itu akan membantu kami melihat peringatan lebih cepat khususnya jika Anda menangani banyak alat NOC.
@bergquist - ada peluang untuk membuka kembali yang ini karena semakin banyak orang yang memintanya.
Saya tidak berpikir sangat sulit untuk mengembangkannya jika Anda menetapkan ambang batas (Min ATAU Maks) dan Anda melebihinya maka alarm akan mulai mengeluarkan suara.
Mencari Anda membalas.
terima kasih
Penjinak

+1 Saya butuh ini

+1 Saya terkejut Grafana tidak memiliki fitur ini.

+1 Sangat perlu menggunakan grafana untuk memantau layar besar.

+1
Kami juga membutuhkan ini! :)

Ini adalah fungsi dasar, kami sangat membutuhkan ini.

+1

+1

+1

+1

Ini sangat keren, kami juga membutuhkan ini! :)

+1 itu bisa sangat berguna untuk memantau sistem TI seperti saya.

+1

+1 akan sangat bagus untuk dimiliki. Grafana telah menjadi pencegah manajemen selama bertahun-tahun, dan fitur seperti ini jelas merupakan sesuatu untuk dipamerkan.

+1

+1 harus memiliki fitur :)

+1

+1
Jika dibutuhkan sangat mendesak, maka kita dapat menyuntikkan JavaScript dinamis untuk memutar suara pada peringatan

setInterval(fungsi() {
Pengguna Peringatan();
}, 60 * 1000);

fungsi AlertUsers() {
if ($('div').hasClass('panel-alert-state--alerting')) {
var audio = Audio baru('http://soundbible.com/grab.php?id=2142&type=mp3');
audio.play();
}
}

Halo semuanya,
pada dasarnya dari vini @Thx kepadanya :D, saya menulis aktivasi peringatan kecil yang dapat Anda nyalakan / matikan di browser Anda.

Aturan peringatan normal akan memicu file suara peringatan + panel status akan mengingatkan.

Perubahan:

grafana/public/views/index.html

<div class="main-view"> <- ADD AFTER THIS LINE

   <ul>

    <li><button style="background-color:#f44336;float:left;margin-left:5%;margin-right:5px;color:white;" onmousedown="clearInterval(stopalertt);stopalertt=false;">ALERT OFF</button>

    <button style="background-color:#4CAF50;color:white;" onmousedown="stopalertt=setInterval(AlertUsers, 5000);">ALERT ON</button></li>

    </ul>

Di akhir file (index.html) sebelum tag /body dan /html ditutup (setelah tag skrip penutup)
masukkan ini:

jika mau, Anda bisa meletakkan ini di file js eksternal.

Tuhan, ini adalah "WYSIWYG" terburuk yang pernah saya lihat. maaf :-/

Salam,
7

Halo semuanya,
pada dasarnya dari vini @thx kepadanya :D, saya menulis aktivasi peringatan kecil yang dapat Anda nyalakan / matikan di browser Anda.

Aturan peringatan normal akan memicu file suara peringatan + panel status akan mengingatkan.

Perubahan:

grafana/public/views/index.html

<div class="main-view"> <- ADD AFTER THIS LINE

   <ul>

    <li><button style="background-color:#f44336;float:left;margin-left:5%;margin-right:5px;color:white;" onmousedown="clearInterval(stopalertt);stopalertt=false;">ALERT OFF</button>

    <button style="background-color:#4CAF50;color:white;" onmousedown="stopalertt=setInterval(AlertUsers, 5000);">ALERT ON</button></li>

    </ul>

Di akhir file (index.html) sebelum tag /body dan /html ditutup (setelah tag skrip penutup)
masukkan ini:

jika mau, Anda bisa meletakkan ini di file js eksternal.

Tuhan, ini adalah "WYSIWYG" terburuk yang pernah saya lihat. maaf :-/

Salam,
7

@7lives83 Terlihat bagus

Bagaimana dengan opsi ini?

@viniston :
Jauh lebih baik :-)

Mungkin Anda ingin memposting Kode Tombol dan di mana menambahkannya?

Terima kasih,
Salam,
Maks

Kami dapat memilih suara kami untuk diperingatkan

tambahkan di bawah ini *li di konten footer*

         <li>

             <a href="javascript:void(0);" class="dropdown-alert-on">
               <a href="javascript:void(0);" class="sidemenu-item dropdown dropup alertondropbtn" onclick="alertOn()">
                  <i  class="fa fa-bell"></i>
                    Alert On
                </a>
              <div id="alertOnDropdown" class="dropdown-content-alert-on">
                <a href="javascript:void(0);" onclick="selectedSound=1;stopalert=setInterval(AlertUsers, 5000);">Analog Watch Alarm</a>
                <a href="javascript:void(0);" onclick="selectedSound=2;stopalert=setInterval(AlertUsers, 5000);">Busy Signal</a>
                <a href="javascript:void(0);" onclick="selectedSound=3;stopalert=setInterval(AlertUsers, 5000);">FogHorn Barge</a>
                <a href="javascript:void(0);" onclick="selectedSound=4;stopalert=setInterval(AlertUsers, 5000);">Metal Metronome</a>
                <a href="javascript:void(0);" onclick="selectedSound=5;stopalert=setInterval(AlertUsers, 5000);">Metronome</a>
                <a href="javascript:void(0);" onclick="selectedSound=6;stopalert=setInterval(AlertUsers, 5000);">Teeth Chatter</a>
                <a href="javascript:void(0);" onclick="selectedSound=7;stopalert=setInterval(AlertUsers, 5000);">Turkey Putt</a>
                <a href="javascript:void(0);" onclick="selectedSound=8;stopalert=setInterval(AlertUsers, 5000);">Store Door Chime</a>
              </div>
            </a>
          </li>
          <li>
            <a href="javascript:void(0);" class="sidemenu-item dropdown dropup" onclick="clearInterval(stopalert);stopalert=false;console.log('Interval stopped', stopalert);" >
              <i class="fa fa-bell-o"></i>
              Alert Off
            </a>
          </li>

bekerja :) gaya kerja yang bagus! terima kasih @viniston

bekerja :) gaya kerja yang bagus! terima kasih @viniston
Terima kasih juga @7lives83

satu saran:

jika Anda mengubah ini:

Anda mendapat menu tarik :-) tetapi ini hanya tip gaya yang sangat kecil. tidak lebih :) kerja bagus vini :)

satu saran:

jika Anda mengubah ini:

Anda mendapat menu tarik :-) tetapi ini hanya tip gaya yang sangat kecil. tidak lebih :) kerja bagus vini :)

Barang keren Mak :)

Dan fitur terakhir:

tambahkan pada titik ini:

<a href="javascript:void(0);" id="alertonbtn" class="sidemenu-item dropdown dropup alertondropbtn" onclick="alertOn()">
<i  class="fa fa-bell"></i>
Alert On
</a>

id="alertonbtn"

tambahkan pada titik ini:

<a href="javascript:void(0);" id="alertoffbtn" class="sidemenu-item dropdown dropup" onclick="clearInterval(stopalert);stopalert=false;console.log('Interval stopped', stopalert);" >
<i class="fa fa-bell-o"></i>
Alert Off
</a>

id="alertoffbtn"

dalam

Sebelumnya saya telah menerapkan fitur di bawah ini. Itu untuk menyorot status saat ini

kelihatan bagus :)

Hai teman-teman,
saya mendesain ulang fungsi kami sedikit, sehingga Anda dapat menambahkannya dengan mudah ke grafana Anda. Salah satu Fitur baru adalah, kami sekarang mengatur cookie untuk menyimpan pilihan terakhir Anda (alarm aktif).

Catatan: Cookie harus diaktifkan di Browser Anda!!

Bangunan Lengkap:

• Semua perubahan dibuat di file /public/view/index.html:

1. Ganti Bagian Footer dengan ini:

<footer class="footer">
          <div class="text-center">
            <ul>
                <li>

                         <a href="javascript:void(0);" class="dropdown-alert-on">
                           <a href="javascript:void(0);" id="alertonbtn" class="sidemenu-item dropdown dropup alertondropbtn" onclick='document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; document.cookie = "alarm=on;path=/";alertOn();checkifonoff();'>
                                  <i class="fa fa-bell"></i>
                                        Alert On
                                </a>
                          <div id="alertOnDropdown" class="dropdown-content-alert-on">
                                <a href="javascript:void(0);" onclick="selectedSound=1;">Standart (BIEP)</a>
                                <a href="javascript:void(0);" onclick="selectedSound=2;">Busy Signal</a>
                                <a href="javascript:void(0);" onclick="selectedSound=3;">FogHorn Barge</a>
                                <a href="javascript:void(0);" onclick="selectedSound=4;">Metal Metronome</a>
                                <a href="javascript:void(0);" onclick="selectedSound=5;">Metronome</a>
                                <a href="javascript:void(0);" onclick="selectedSound=6;">Teeth Chatter</a>
                                <a href="javascript:void(0);" onclick="selectedSound=7;">Turkey Putt</a>
                                <a href="javascript:void(0);" onclick="selectedSound=8;">Store Door Chime</a>
                          </div>
                        </a>
          </li>
                  <li>
             <a href="javascript:void(0);" id="alertoffbtn" class="sidemenu-item dropdown dropup" onclick='document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";document.cookie = "alarm=off;path=/";checkifonoff();' >
              <i class="fa fa-bell-o"></i>
              Alert Off
            </a>
          </li>
                [[if .NewGrafanaVersionExists]]
                    <li>
                <a href="https://grafana.com/get" target="_blank" bs-tooltip="'[[.NewGrafanaVersion]]'">
                  New version available!
                </a>
              </li>
                [[end]]
                          </ul>
          </div>
        </footer>

1. Sebelum tag </body> tambahkan ini:

<script>
var checkcookie = document.cookie;
console.log("Cookie-Check Inital:", checkcookie);
if (checkcookie === "") {
document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "alarm=on;path=/";
console.log("Cookie-Check-First-Set:", checkcookie);
}

var checkoffon = setInterval(checkifonoff,6000);
var selectedSound = 1; var sounds = { '1': 'https://www.soundjay.com/button/beep-04.mp3', '2': 'http://soundbible.com/grab.php?id=1072&type=mp3', '3': 'http://soundbible.com/grab.php?id=2142&type=mp3', '4': 'http://soundbible.com/grab.php?id=915&type=mp3', '5': 'http://soundbible.com/grab.php?id=914&type=mp3', '6': 'http://soundbible.com/grab.php?id=1344&type=mp3', '7': 'http://soundbible.com/grab.php?id=1318&type=mp3', '8': 'http://soundbible.com/grab.php?id=1599&type=mp3', };

function checkifonoff() {
var checkcookie = document.cookie;

if (checkcookie === "alarm=off"){
var stopalertbtn = document.getElementById('alertoffbtn');
var startalertbtn = document.getElementById('alertonbtn');
stopalertbtn.style.color= 'green';
startalertbtn.style.color= '#8e8e8e';
document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "alarm=off;path=/";
console.log("ALARM OFF", checkcookie);
}

if (checkcookie === "alarm=on") {
var startalertbtn = document.getElementById('alertonbtn');
var stopalertbtn = document.getElementById('alertoffbtn');
startalertbtn.style.color= 'green';
stopalertbtn.style.color= '#8e8e8e';
var audioPath = sounds[selectedSound]; if ($('div').hasClass('panel-alert-state--alerting')) { console.log('panel-alert-state--alerting'); var audio = new Audio(audioPath); audio.play(); } if ($('div').hasClass('panel-container st-card effect-hover error-state')) { console.log('panel-container st-card effect-hover error-state'); var audio = new Audio(audioPath); audio.play(); } if ($('div').hasClass('panel-container panel-transparent st-card effect-hover error-state')) { console.log('panel-container panel-transparent st-card effect-hover error-state'); var audio = new Audio(audioPath); audio.play(); }
document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "alarm=on;path=/";
console.log("ALARM ON", checkcookie);
}
}


function alertOn() {
document.getElementById("alertOnDropdown").classList.toggle("show");
}

window.onclick = function(event) {
if (!event.target.matches('.alertondropbtn')) {
var dropdowns = document.getElementsByClassName("dropdown-content-alert-on");
var i;
for (i = 0; i < dropdowns.length; i++) {
var openDropdown = dropdowns[i];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
}

</script>
<style>
        .dropdown-alert-on {
          position: relative;
          display: inline-block;
        }

        .dropdown-content-alert-on {
          display: none;
          position: absolute;
          background: #161719;
          min-width: 160px;
          overflow: auto;
          box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
          z-index: 1;
          border-bottom: 1px solid #444;
          bottom: 20px;
        }

        .dropdown-content-alert-on a {
          color: black;
          padding: 12px 16px;
          text-decoration: none;
          display: block;
                  padding: 8px 16px;
                font-size: 12px;
                color: #8e8e8e;
                margin-bottom: 4px;
                white-space: nowrap;
        }

        .dropdown-alert-on a:hover {background-color: #ddd;}

        .show {display: block;}

        .text-center {position: relative;}

        .footer {position: absolute;
                top:100%;
                padding: 0 0 0 0;}

        .is-react .footer {display: block;}
</style>

Semuanya yang Saya Hormati,

senang melihat yang ini, saya punya pertanyaan, bagaimana jika peringatan suara ada di server yang sama dengan grafana, apakah ada kode yang harus diubah?

@7lives83
Hei sangat bagus.
Apakah mungkin menggunakan mp3 lokal. Saya tidak membuatnya bekerja

@Yudhistir4

Semuanya yang Saya Hormati,

senang melihat yang ini, saya punya pertanyaan, bagaimana jika peringatan suara ada di server yang sama dengan grafana, apakah ada kode yang harus diubah?

@DS95

@7lives83
Hei sangat bagus.
Apakah mungkin menggunakan mp3 lokal. Saya tidak membuatnya bekerja

Semoga Yud berarti sama?! :-)

Tentu. Anda hanya perlu mengubah tujuan file Audio. Salin Suara Anda ke direktori suara baru di folder publik Anda seperti ini:

ls-ltr:
-rw-r--r-- 1 root root 0 27 Jan 13:10 test1.mp3
-rw-r--r-- 1 root root 0 27 Jan 13:11 test2.mp3
[email protected] :/usr/share/grafana/public/sounds#

Sekarang ubah tujuan Suara yang Anda pilih (dalam contoh ini saya gunakan sebagai nama server yourmetricserver.localdomain.com <- Anda perlu mengubah ini menjadi nama server Anda, di mana server grafana aktif):

var dipilihSuara = 1; var suara = { '1': ' https://yourmetricserver.localdomain.com/public/sounds/test1.mp3 ', '2': ' https://yourmetricserver.localdomain.com/public/sounds/test2.mp3 ', '3': ' https://yourmetricserver.localdomain.com/public/sounds/test3.mp3 ', '4': ' https://yourmetricserver.localdomain.com/public/sounds/test4.mp3 ',
....... };

@7lives83
Hei sangat bagus.
Apakah mungkin menggunakan mp3 lokal. Saya tidak membuatnya bekerja

Hai,

Silakan lakukan hal-hal berikut untuk memutar suara dari file mp3 lokal Anda

var audio = new Audio('public/sounds/carHorn.mp3'); audio.play();

Ini tentang mengubah lokasi file mp3. Itu dia. Jika Anda membutuhkan lebih banyak bantuan, kami siap membantu Anda

Contoh:
HTML:
<a href="javascript:void(0);" class="dropdown-alert-on"> <a href="javascript:void(0);" class="sidemenu-item dropdown dropup alertondropbtn" onclick="PlaySound()"> <i class="fa fa-bell"></i> Play Sound </a>

JAVASCRIPT:
fungsi PlaySound() {
var audio = new Audio('public/sounds/carHorn.mp3');
audio.play();
}

@7lives83
Hei sangat bagus.
Apakah mungkin menggunakan mp3 lokal. Saya tidak membuatnya bekerja

Hai,

Silakan lakukan hal-hal berikut untuk memutar suara dari file mp3 lokal Anda

var audio = new Audio('public/sounds/carHorn.mp3'); audio.play();

Ini tentang mengubah lokasi file mp3. Itu dia. Jika Anda membutuhkan lebih banyak bantuan, kami siap membantu Anda

Contoh:
HTML:
<a href="javascript:void(0);" class="dropdown-alert-on"> <a href="javascript:void(0);" class="sidemenu-item dropdown dropup alertondropbtn" onclick="PlaySound()"> <i class="fa fa-bell"></i> Play Sound </a>

JAVASCRIPT:
fungsi PlaySound() {
var audio = new Audio('public/sounds/carHorn.mp3');
audio.play();
}

Silakan ekstrak folder terlampir dan letakkan di dalam folder publik
suara.zip