JanKoppe/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Grafana Cat Panel

Recent studies have shown that a steady flow of cute kitten pictures can increase work productivity by up to 100% and boost general morale. Therefore every dashboard should provide a cat panel.
Paste this code in a "Text" Panel with html mode and enjoy.

  
## panel.html
<div id="cat-anchor"></div>
<script>
var catAnchor = document.getElementById("cat-anchor");

/* this is ugly, but gets a reference to the .panel-container parent element */
var panelContainer = catAnchor.parentNode.parentNode.parentNode.parentNode;

panelContainer.style.backgroundRepeat = "no-repeat";
panelContainer.style.backgroundPosition = "center center";
panelContainer.style.backgroundSize = "cover";

function neuekatze() {
  panelContainer.style.backgroundImage = "url('https://thecatapi.com/api/images/get?format=src&type=jpg&size=small&rand=" + new Date().getTime() + "')";
}
neuekatze();
setInterval(neuekatze, 5000);

</script>
	<div id="cat-anchor"></div>
	<script>
	var catAnchor = document.getElementById("cat-anchor");

	/* this is ugly, but gets a reference to the .panel-container parent element */
	var panelContainer = catAnchor.parentNode.parentNode.parentNode.parentNode;

	panelContainer.style.backgroundRepeat = "no-repeat";
	panelContainer.style.backgroundPosition = "center center";
	panelContainer.style.backgroundSize = "cover";

	function neuekatze() {
	panelContainer.style.backgroundImage = "url('https://thecatapi.com/api/images/get?format=src&type=jpg&size=small&rand=" + new Date().getTime() + "')";
	}
	neuekatze();
	setInterval(neuekatze, 5000);

	</script>