- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi,
I was wondering how can I create a panel with only a clock on it.
I tried to insert a html code an then add a javascript file but the panel is still empty.
xml dashboard:
<dashboard script="clock.js">
<row>
<panel>
<html>
<div class="clock"></div>
</html>
</panel>
</row>
</dashboard>
clock.js:
require([
"splunkjs/ready!",
"splunkjs/mvc/simplexml/ready!"
],
function clock() {// We create a new Date object and assign it to a variable called "time".
var time = new Date(),
// Access the "getHours" method on the Date object with the dot accessor.
hours = time.getHours(),
// Access the "getMinutes" method with the dot accessor.
minutes = time.getMinutes(),
seconds = time.getSeconds();
document.querySelectorAll('.clock')[0].innerHTML = harold(hours) + ":" + harold(minutes) + ":" + harold(seconds);
function harold(standIn) {
if (standIn < 10) {
standIn = '0' + standIn
}
return standIn;
}
}
setInterval(clock, 1000);
);
Did I miss something?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
The syntax of your JS is a little off. I cleaned it up here:
require([
"splunkjs/ready!",
"splunkjs/mvc/simplexml/ready!"
], function() {
function clock() {// We create a new Date object and assign it to a variable called "time".
var time = new Date(), hours = time.getHours(), minutes = time.getMinutes(), seconds = time.getSeconds();
document.querySelectorAll('.clock')[0].innerHTML = harold(hours) + ":" + harold(minutes) + ":" + harold(seconds);
function harold(standIn) {
if (standIn < 10) {
standIn = '0' + standIn
}
return standIn;
}
}
setInterval(clock, 1000);
});
After you've fixed your JS, you'll need to use the _bump function to get Splunk to pick up the new JS. So you'll visit http(s)://your.server.here:port/en-US/_bump
You can read more about using _bump here:
http://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/CustomizationOptions
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
The syntax of your JS is a little off. I cleaned it up here:
require([
"splunkjs/ready!",
"splunkjs/mvc/simplexml/ready!"
], function() {
function clock() {// We create a new Date object and assign it to a variable called "time".
var time = new Date(), hours = time.getHours(), minutes = time.getMinutes(), seconds = time.getSeconds();
document.querySelectorAll('.clock')[0].innerHTML = harold(hours) + ":" + harold(minutes) + ":" + harold(seconds);
function harold(standIn) {
if (standIn < 10) {
standIn = '0' + standIn
}
return standIn;
}
}
setInterval(clock, 1000);
});
After you've fixed your JS, you'll need to use the _bump function to get Splunk to pick up the new JS. So you'll visit http(s)://your.server.here:port/en-US/_bump
You can read more about using _bump here:
http://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/CustomizationOptions
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Thanks!
It works
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
But it shows your client time (Time in which your browser is running)..
May be not inline with your data always. Please try to get server time..
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Yes, this will always show client time, because JavaScript runs in the browser, not on the server. If you want server time, you'll need a query that gets sent to the server. I don't know off-hand what the right query would be for that, so this would make a good follow-up question presented in its own Answers post. Probably nobody will see the question buried here in comments, especially since the original question has been answered.
