Displaying the sharepoint server date and time under the username

Question

I am trying to display the server date and time under the username inside my SharePoint 2013 server. I did the following :- On the master page I added the following “currentdate” Div :-

<wssuc:Welcome id="IdWelcome" runat="server" EnableViewState="false" />
<div id="currentdate"></div>

And on the web page I added a script editor web part and I added the following script :-

<script type= "text/javascript">   
document.getElementById("currentdate").innerHTML = formatAMPM();   
function formatAMPM() { 
var d = new Date(),    
    minutes = d.getMinutes().toString().length == 1 ? '0'+d.getMinutes() : d.getMinutes(),   
    hours = d.getHours().toString().length == 1 ? '0'+d.getHours() : d.getHours(),   
    ampm = d.getHours() >= 12 ? 'pm' : 'am',   
    months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],   
    days = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
return days[d.getDay()]+' '+d.getDate()+'  '+months[d.getMonth()]+'  '+d.getFullYear()+' '+hours+':'+minutes+' ' +ampm; 
}    
</script>

The above will display the data and time as follow :-

But I have the following couple of questions:-

1. Currently my approach will display client local time and date, instead I need to display the server date and time.

2. The current approach will not update the date and time unless the web browser is refreshed, so this there a way to add something such as timer to fire each second, or each minute?

3. As I am adding the javaScript code inside a script editor web part, so I have to add this web part to all pages. So how I can add the script tot the master page so that data and time will be displayed on all the pages automatically.

4. Final question, as show in the above picture, the alignment of the username and the date and time are not exactly the same. so how I can force the username and the current date and time to have the same vertical alignment ?

Answer 1

Since you can use Server Object model, then I would suggest you to create a delegate control. The delegate control will use the server code to determine the server date and time. You can also implement AJAX for page refresh. Here is an example of determining the server date time reginal settings using AJAX.

The advantage with using delegate control is that you can use it in master page and hence every page using the master page will have this control. For fourth point, I will suggest you to use IE developer tool to check tha alignment issue.