Skip to content
Snippets Groups Projects
Commit 183a4af3 authored by Gabriel Zachmann's avatar Gabriel Zachmann
Browse files

webinterface: remove buttons from tokeninfo panes, directory load content on tab switch

parent aab6d141
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 101 additions and 54 deletions
internal/server/web/partials/style.mustache
+ 0
− 1
View file @ 183a4af3
<link rel="stylesheet" href="/static/css/colors.css">
{{#logged-in}}
<link rel="stylesheet" href="/static/css/mytoken-loggedin.css">
<link rel="stylesheet" href="/static/css/at.css">
<link rel="stylesheet" href="/static/css/lib/bootstrap4-toggle.min.css">
{{/logged-in}}
{{#consent}}
......
internal/server/web/partials/tokeninfo.mustache
+ 36
− 12
View file @ 183a4af3
......@@ -3,48 +3,72 @@
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs">
<li class="nav-item">
<a class="nav-link active" id="session-info-tab" data-toggle="tab" href="#session" role="tab" aria-controls="session" aria-selected="true">Session Token Info</a>
<a class="nav-link active" id="session-info-tab" data-toggle="tab" href="#session" role="tab"
aria-controls="session" aria-selected="true">Session Token Info</a>
</li>
<li class="nav-item">
<a class="nav-link" id="history-tab" data-toggle="tab" href="#history" role="tab" aria-controls="history" aria-selected="false">Session Token History</a>
<a class="nav-link" id="history-tab" data-toggle="tab" href="#history" role="tab"
aria-controls="history" aria-selected="false">Session Token History</a>
</li>
<li class="nav-item">
<a class="nav-link" id="tree-tab" data-toggle="tab" href="#tree" role="tab" aria-controls="tree" aria-selected="false">Session Token Subtokens</a>
<a class="nav-link" id="tree-tab" data-toggle="tab" href="#tree" role="tab" aria-controls="tree"
aria-selected="false">Session Token Subtokens</a>
</li>
<li class="nav-item">
<a class="nav-link" id="list-tab" data-toggle="tab" href="#list" role="tab" aria-controls="list" aria-selected="false">All Mytokens</a>
<a class="nav-link" id="list-tab" data-toggle="tab" href="#list" role="tab" aria-controls="list"
aria-selected="false">All Mytokens</a>
</li>
</ul>
</div>
<div class="card-body tab-content">
<div class="tab-pane show active" id="session" role="tabpanel" aria-labelledby="session-info-tab">
<button class="btn btn-copy d-none" id="session-copy" data-toggle="tooltip" data-placement="bottom" title="Copy to clipboard" data-clipboard-target="#session-token-info-msg">
<h4>Information About the Session's Mytoken</h4>
<button class="btn btn-reload" id="session-reload" data-toggle="tooltip" data-placement="bottom"
title="Reload data">
<i class="fas fa-sync"></i>
</button>
<button class="btn btn-copy d-none" id="session-copy" data-toggle="tooltip" data-placement="bottom"
title="Copy to clipboard" data-clipboard-target="#session-token-info-msg">
<i class="far fa-copy"></i>
</button>
<pre class="card-text" id="session-token-info-msg"></pre>
<a href="#" class="btn btn-primary mx-auto d-block" id="get-session-token-info">Get information about session's mytoken</a>
</div>
<div class="tab-pane" id="history" role="tabpanel" aria-labelledby="history-tab">
<button class="btn btn-copy d-none" id="history-copy" data-toggle="tooltip" data-placement="bottom" title="Copy to clipboard" data-clipboard-target="#history-msg">
<h4>Event History for Session's Mytoken</h4>
<button class="btn btn-reload" id="history-reload" data-toggle="tooltip" data-placement="bottom"
title="Reload data">
<i class="fas fa-sync"></i>
</button>
<button class="btn btn-copy d-none" id="history-copy" data-toggle="tooltip" data-placement="bottom"
title="Copy to clipboard" data-clipboard-target="#history-msg">
<i class="far fa-copy"></i>
</button>
<p class="card-text" id="history-msg"></p>
<a href="#" class="btn btn-primary mx-auto d-block" id="get-history">Get Event-history for session's mytoken</a>
</div>
<div class="tab-pane" id="tree" role="tabpanel" aria-labelledby="tree-tab">
<button class="btn btn-copy d-none" id="tree-copy" data-toggle="tooltip" data-placement="bottom" title="Copy to clipboard" data-clipboard-target="#tree-msg">
<h4>Subtokens for Session's Mytoken</h4>
<button class="btn btn-reload" id="tree-reload" data-toggle="tooltip" data-placement="bottom"
title="Reload data">
<i class="fas fa-sync"></i>
</button>
<button class="btn btn-copy d-none" id="tree-copy" data-toggle="tooltip" data-placement="bottom"
title="Copy to clipboard" data-clipboard-target="#tree-msg">
<i class="far fa-copy"></i>
</button>
<p class="card-text" id="tree-msg"></p>
<a href="#" class="btn btn-primary mx-auto d-block" id="get-tree">List subtokens for session's mytoken</a>
</div>
<div class="tab-pane" id="list" role="tabpanel" aria-labelledby="list-tab">
<button class="btn btn-copy d-none" id="list-copy" data-toggle="tooltip" data-placement="bottom" title="Copy to clipboard" data-clipboard-target="#list-msg">
<h4>All Your Mytokens</h4>
<button class="btn btn-reload" id="list-reload" data-toggle="tooltip" data-placement="bottom"
title="Reload data">
<i class="fas fa-sync"></i>
</button>
<button class="btn btn-copy d-none" id="list-copy" data-toggle="tooltip" data-placement="bottom"
title="Copy to clipboard" data-clipboard-target="#list-msg">
<i class="far fa-copy"></i>
</button>
<p class="card-text" id="list-msg"></p>
<a href="#" class="btn btn-danger mx-auto d-block" id="get-list">List all mytokens</a>
</div>
</div>
</div>
internal/server/web/static/css/at.css deleted 100644 → 0
+ 0
− 5
View file @ aab6d141
.tab-pane .btn-copy {
position: absolute;
margin-top: -28px;
right: -8px;
}
internal/server/web/static/css/mytoken-loggedin.css
+ 34
− 1
View file @ 183a4af3
.hover-text {
display: none;
}
.hover-item:hover span {
display: block;
}
.hover-item:hover i{
.hover-item:hover i {
display: none;
}
span.user-agent i + i {
padding-left: 1em;
}
@media (min-width: 1440px) {
.break-out {
margin: -1.25rem -125px;
padding: 1.25rem;
}
}
@media (min-width: 1600px) {
.break-out {
margin: -1.25rem -225px;
padding: 1.25rem;
}
}
.tab-pane .btn-copy {
position: absolute;
margin-top: -28px;
right: -8px;
}
.tab-pane .btn-reload {
position: absolute;
margin-top: -28px;
right: 14px;
}
internal/server/web/static/css/mytoken.css
+ 0
− 18
View file @ 183a4af3
......@@ -21,21 +21,3 @@
width: 100%;
height: 2.5rem; /* Footer height */
}
span.user-agent i + i {
padding-left: 1em;
}
@media (min-width: 1440px) {
.break-out{
margin: -1.25rem -125px;
padding: 1.25rem;
}
}
@media (min-width: 1600px) {
.break-out {
margin: -1.25rem -225px;
padding: 1.25rem;
}
}
internal/server/web/static/js/home.js
+ 7
− 1
View file @ 183a4af3
......@@ -25,13 +25,19 @@ $(function (){
$('.nav-tabs a[href="#'+hash+'"]').tab('show') ;
}
})
// With HTML5 history API, we can easily prevent scrolling!
$('.nav-tabs a').on('shown.bs.tab', function (e) {
if(history.pushState) {
if (history.pushState) {
history.pushState(null, null, e.target.hash);
} else {
window.location.hash = e.target.hash; //Polyfill for old browsers
}
let $found = $(this).parents('.card').find('.tab-pane.active .nav-tabs a.active');
if ($found.attr('id') !== $(this).attr('id')) {
$found.triggerHandler('shown.bs.tab');
}
})
......
internal/server/web/static/js/tokeninfo.js
+ 24
− 15
View file @ 183a4af3
......@@ -19,12 +19,12 @@ function _tokeninfo(action, successFnc, errorFnc, token=undefined) {
}
$('#get-session-token-info').on('click', function(e){
function getSessionTokenInfo(e) {
e.preventDefault();
let msg = $('#session-token-info-msg');
let copy = $('#session-copy');
e.preventDefault();
_tokeninfo('introspect',
function(res){
function (res) {
let token = res['token'];
let iss = token['oidc_iss'];
if (iss) {
......@@ -32,7 +32,7 @@ $('#get-session-token-info').on('click', function(e){
}
let scopes = extractMaxScopesFromToken(token);
storageSet('token_scopes', scopes, true);
msg.text(JSON.stringify(res,null,4));
msg.text(JSON.stringify(res, null, 4));
msg.removeClass('text-danger');
copy.removeClass('d-none');
},
......@@ -42,7 +42,7 @@ $('#get-session-token-info').on('click', function(e){
copy.removeClass('d-none');
})
return false;
})
}
function userAgentToHTMLIcons(userAgent) {
let icons = FaUserAgent.faUserAgent(userAgent);
......@@ -117,12 +117,12 @@ function tokenlistToHTML(tokenTrees) {
'</tbody></table>';
}
$('#get-history').on('click', function(e){
function getHistoryTokenInfo(e) {
e.preventDefault();
let msg = $('#history-msg');
let copy = $('#history-copy');
_tokeninfo('event_history',
function(res){
function (res) {
msg.html(historyToHTML(res['events']));
msg.removeClass('text-danger');
copy.addClass('d-none');
......@@ -133,14 +133,14 @@ $('#get-history').on('click', function(e){
copy.removeClass('d-none');
})
return false;
})
}
$('#get-tree').on('click', function(e){
function getTreeTokenInfo(e) {
e.preventDefault();
let msg = $('#tree-msg');
let copy = $('#tree-copy');
_tokeninfo('subtoken_tree',
function(res){
function (res) {
msg.html(tokenlistToHTML([res['mytokens']]));
msg.removeClass('text-danger');
copy.addClass('d-none');
......@@ -151,9 +151,9 @@ $('#get-tree').on('click', function(e){
copy.removeClass('d-none');
})
return false;
})
}
$('#get-list').on('click', function(e){
function getListTokenInfo(e) {
e.preventDefault();
let msg = $('#list-msg');
let copy = $('#list-copy');
......@@ -161,7 +161,7 @@ $('#get-list').on('click', function(e){
function (res) {
const mToken = res['mytoken']
_tokeninfo('list_mytokens',
function(infoRes){
function (infoRes) {
msg.html(tokenlistToHTML(infoRes['mytokens']));
msg.removeClass('text-danger');
copy.addClass('d-none');
......@@ -170,7 +170,7 @@ $('#get-list').on('click', function(e){
msg.text(getErrorMessage(errRes));
msg.addClass('text-danger');
copy.removeClass('d-none');
}, mToken) ;
}, mToken);
},
function (errRes) {
msg.text(getErrorMessage(errRes));
......@@ -180,4 +180,13 @@ $('#get-list').on('click', function(e){
"list_mytokens"
);
return false;
})
}
$('#session-info-tab').on('shown.bs.tab', getSessionTokenInfo)
$('#session-reload').on('click', getSessionTokenInfo)
$('#history-tab').on('shown.bs.tab', getHistoryTokenInfo)
$('#history-reload').on('click', getHistoryTokenInfo)
$('#tree-tab').on('shown.bs.tab', getTreeTokenInfo)
$('#tree-reload').on('click', getTreeTokenInfo)
$('#list-tab').on('shown.bs.tab', getListTokenInfo)
$('#list-reload').on('click', getListTokenInfo)
internal/server/web/static/js/utils.js
+ 0
− 1
View file @ 183a4af3
$.fn.serializeObject = function() {
let o = {};
let a = this.serializeArray();
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

A HIFIS Service | Privacy | Imprint | Support | Documentation | Changelog