header.html

<div class="logo header_bg">
    ICNML
</div>
<div class="user_info header_bg">
    <span>{{ session[ 'username' ] }}</span>
    <span>|</span>
    <span id="icnml_countdown">-</span>
    <span>|</span>
    <span><a href="{{ url_for( 'serve_qrcode' ) }}">Update TOTP</a></span>
    <span>|</span>
    <span><a href="{{ url_for( 'webauthn_key_management' ) }}">Security keys</a></span>
    <span>|</span>
    <span><a href="{{ url_for( 'logout' ) }}">Logout</a></span>
</div>
<script type="text/javascript">
    var eventTime = moment().add( {{ session_timeout }}, 'seconds' );
    var interval = 1000;
    
    setInterval( function()
	{
        var duration = moment.duration( eventTime - moment(), 'milliseconds' );
        if( duration < 0 )
        {
        	location.reload();
        } else {
        	var minutes = moment( duration.minutes(), 'minutes' ).format( "mm" );
        	var seconds = moment( duration.seconds(), 'seconds' ).format( "ss" );
        	
            $( '#icnml_countdown' )
        	    .text( minutes + ":" + seconds );
        }
    }, interval );
</script>