Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Grafana full screen "plugin"
<button id="enter-full-screen">Enter full screen</button>
<style>
#enter-full-screen {
display: block;
margin: 60px auto;
padding: 30px 70px;
background: #464545;
border: 1px solid #636363;
}
</style>
<script>
var container = document.querySelector('.dashboard-container');
var button = document.querySelector('#enter-full-screen');
var cursor = button;
while (cursor) {
if (cursor.className.match(/\bdash-row\b/)) {
break;
} else {
cursor = cursor.parentNode;
}
}
var row = cursor;
button.addEventListener('click', function() {
container.style.background = 'inherit';
row.style.display = 'none';
launchIntoFullscreen(container);
});
function launchIntoFullscreen(el) {
if (el.requestFullscreen) el.requestFullscreen();
if (el.mozRequestFullScreen) el.mozRequestFullScreen();
if (el.webkitRequestFullscreen) el.webkitRequestFullscreen();
if (el.msRequestFullscreen) el.msRequestFullscreen();
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.