From 7a130d1fe5baecd6b83a13543de2ccc39c260abe Mon Sep 17 00:00:00 2001
From: zachmann <gabriel.zachmann@kit.edu>
Date: Thu, 18 Aug 2022 14:57:02 +0200
Subject: [PATCH] add elements to home page that can be used with login
---
internal/server/handlers.go | 18 +++---
internal/server/web/partials/scripts.mustache | 7 ++-
internal/server/web/partials/style.mustache | 6 +-
internal/server/web/sites/home.mustache | 51 ++++++++++------
internal/server/web/sites/index.mustache | 15 -----
.../web/static/css/mytoken-loggedin.css | 56 ------------------
internal/server/web/static/css/mytoken.css | 59 ++++++++++++++++++-
.../server/web/static/js/home-logged-in.js | 9 +++
.../web/static/js/home-not-logged-in.js | 7 +++
internal/server/web/static/js/home.js | 10 +---
.../server/web/static/js/logged-in-utils.js | 8 ---
internal/server/web/static/js/utils.js | 9 ++-
12 files changed, 132 insertions(+), 123 deletions(-)
delete mode 100644 internal/server/web/sites/index.mustache
delete mode 100644 internal/server/web/static/css/mytoken-loggedin.css
create mode 100644 internal/server/web/static/js/home-logged-in.js
create mode 100644 internal/server/web/static/js/home-not-logged-in.js
delete mode 100644 internal/server/web/static/js/logged-in-utils.js
diff --git a/internal/server/handlers.go b/internal/server/handlers.go
index 8600b215..49ffb021 100644
--- a/internal/server/handlers.go
+++ b/internal/server/handlers.go
@@ -13,10 +13,9 @@ import (
)
func handleIndex(ctx *fiber.Ctx) error {
- binding := map[string]interface{}{
- templating.MustacheKeyLoggedIn: false,
- templating.MustacheKeyCookieLifetime: cookies.CookieLifetime,
- }
+ binding := homeBindingData()
+ binding[templating.MustacheKeyLoggedIn] = false
+ binding[templating.MustacheKeyCookieLifetime] = cookies.CookieLifetime
providers := []map[string]string{}
for _, p := range config.Get().Providers {
pp := make(map[string]string, 2)
@@ -25,11 +24,11 @@ func handleIndex(ctx *fiber.Ctx) error {
providers = append(providers, pp)
}
binding["providers"] = providers
- return ctx.Render("sites/index", binding, templating.LayoutMain)
+ return ctx.Render("sites/home", binding, templating.LayoutMain)
}
-func handleHome(ctx *fiber.Ctx) error {
- binding := map[string]interface{}{
+func homeBindingData() map[string]interface{} {
+ return map[string]interface{}{
templating.MustacheKeyLoggedIn: true,
templating.MustacheKeyRestrictionsGUI: true,
templating.MustacheKeyHome: true,
@@ -46,7 +45,10 @@ func handleHome(ctx *fiber.Ctx) error {
templating.MustacheKeyPrefix: "createMT-",
},
}
- return ctx.Render("sites/home", binding, templating.LayoutMain)
+}
+
+func handleHome(ctx *fiber.Ctx) error {
+ return ctx.Render("sites/home", homeBindingData(), templating.LayoutMain)
}
func handleSettings(ctx *fiber.Ctx) error {
diff --git a/internal/server/web/partials/scripts.mustache b/internal/server/web/partials/scripts.mustache
index 36638bfc..d241fb39 100644
--- a/internal/server/web/partials/scripts.mustache
+++ b/internal/server/web/partials/scripts.mustache
@@ -1,3 +1,4 @@
+<script src="{{instance-url}}/static/js/lib/clipboard.min.js"></script>
<script src="{{instance-url}}/static/js/utils.js"></script>
<script src="{{instance-url}}/static/js/storage.js"></script>
<script src="{{instance-url}}/static/js/discovery.js"></script>
@@ -5,14 +6,14 @@
<script src="{{instance-url}}/static/js/login-check.js"></script>
{{^logged-in}}
<script src="{{instance-url}}/static/js/login.js"></script>
+ <script src="{{instance-url}}/static/js/home-not-logged-in.js"></script>
{{/logged-in}}
{{#logged-in}}
- <script src="{{instance-url}}/static/js/lib/clipboard.min.js"></script>
- <script src="{{instance-url}}/static/js/logged-in-utils.js"></script>
- <script src="{{instance-url}}/static/js/lib/bootstrap4-toggle.min.js"></script>
<script src="{{instance-url}}/static/js/logout.js"></script>
+ <script src="{{instance-url}}/static/js/home-logged-in.js"></script>
{{/logged-in}}
{{#home}}
+ <script src="{{instance-url}}/static/js/lib/bootstrap4-toggle.min.js"></script>
<script src="{{instance-url}}/static/js/lib/user-agent.min.js"></script>
<script src="{{instance-url}}/static/js/mt-helper.js"></script>
<script src="{{instance-url}}/static/js/home.js"></script>
diff --git a/internal/server/web/partials/style.mustache b/internal/server/web/partials/style.mustache
index 086c622f..b31ca6f1 100644
--- a/internal/server/web/partials/style.mustache
+++ b/internal/server/web/partials/style.mustache
@@ -1,10 +1,6 @@
<link rel="stylesheet" href="{{instance-url}}/static/css/colors.css">
-{{#logged-in}}
- <link rel="stylesheet" href="{{instance-url}}/static/css/mytoken-loggedin.css">
- <link rel="stylesheet" href="{{instance-url}}/static/css/lib/bootstrap4-toggle.min.css">
-{{/logged-in}}
+<link rel="stylesheet" href="{{instance-url}}/static/css/lib/bootstrap4-toggle.min.css">
{{#consent}}
- <link rel="stylesheet" href="{{instance-url}}/static/css/lib/bootstrap4-toggle.min.css">
<link rel="stylesheet" href="{{instance-url}}/static/css/capabilities.css">
{{/consent}}
{{#settings-ssh}}
diff --git a/internal/server/web/sites/home.mustache b/internal/server/web/sites/home.mustache
index 1b54e2b0..1b9a1b15 100644
--- a/internal/server/web/sites/home.mustache
+++ b/internal/server/web/sites/home.mustache
@@ -1,33 +1,40 @@
<div class="card">
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs">
+ {{#logged-in}}
+ <li class="nav-item">
+ <a class="nav-link active" id="at-tab" data-toggle="tab" href="#at" role="tab" aria-controls="at"
+ aria-selected="true">Access Token</a>
+ </li>
+ {{/logged-in}}
<li class="nav-item">
- <a class="nav-link active" id="at-tab" data-toggle="tab" href="#at" role="tab" aria-controls="at"
- aria-selected="true">Access Token</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="mt-tab" data-toggle="tab" href="#mt" role="tab" aria-controls="mt"
- aria-selected="false">Create Mytoken</a>
+ <a class="nav-link{{^logged-in}} active{{/logged-in}}" id="mt-tab" data-toggle="tab" href="#mt"
+ role="tab" aria-controls="mt" aria-selected="false">Create Mytoken</a>
</li>
<li class="nav-item">
<a class="nav-link" id="info-tab" data-toggle="tab" href="#info" role="tab" aria-controls="info"
aria-selected="false">Tokeninfo</a>
</li>
- <li class="nav-item">
- <a class="nav-link" id="list-mts-tab" data-toggle="tab" href="#list-mts" role="tab"
- aria-controls="list-mts" aria-selected="false">My Mytokens</a>
- </li>
<li class="nav-item">
<a class="nav-link" id="tc-tab" data-toggle="tab" href="#transfer" role="tab"
aria-controls="transfer" aria-selected="false">Exchange Transfercode</a>
</li>
+ {{#logged-in}}
+ <li class="nav-item">
+ <a class="nav-link" id="list-mts-tab" data-toggle="tab" href="#list-mts" role="tab"
+ aria-controls="list-mts" aria-selected="false">My Mytokens</a>
+ </li>
+ {{/logged-in}}
</ul>
</div>
<div class="card-body tab-content">
- <div class="tab-pane show active" id="at" role="tabpanel" aria-labelledby="at-tab">
- {{> create-at}}
- </div>
- <div class="tab-pane bg-secondary break-out" id="mt" role="tabpanel" aria-labelledby="mt-tab">
+ {{#logged-in}}
+ <div class="tab-pane show active" id="at" role="tabpanel" aria-labelledby="at-tab">
+ {{> create-at}}
+ </div>
+ {{/logged-in}}
+ <div class="tab-pane bg-secondary break-out{{^logged-in}} active{{/logged-in}}" id="mt" role="tabpanel"
+ aria-labelledby="mt-tab">
<div class="bg-secondary ">
{{> create-mt}}
</div>
@@ -35,11 +42,19 @@
<div class="tab-pane" id="info" role="tabpanel" aria-labelledby="info-tab">
{{> tokeninfo}}
</div>
- <div class="tab-pane" id="list-mts" role="tabpanel" aria-labelledby="list-mts-tab">
- {{> list-mts}}
- </div>
<div class="tab-pane" id="transfer" role="tabpanel" aria-labelledby="tc-tab">
{{> transfercode}}
</div>
+ {{#logged-in}}
+ <div class="tab-pane" id="list-mts" role="tabpanel" aria-labelledby="list-mts-tab">
+ {{> list-mts}}
+ </div>
+ {{/logged-in}}
</div>
-</div>
\ No newline at end of file
+</div>
+
+{{^logged-in}}
+ <script>
+ let cookieLifetime = {{cookie-lifetime}};
+ </script>
+{{/logged-in}}
diff --git a/internal/server/web/sites/index.mustache b/internal/server/web/sites/index.mustache
deleted file mode 100644
index 731309b6..00000000
--- a/internal/server/web/sites/index.mustache
+++ /dev/null
@@ -1,15 +0,0 @@
-<h1>Welcome to the mytoken service</h1>
-
-<p>
- This is a demo instance of the mytoken service. This service is currently under active development.<br>
- For more information refer to: <a href="https://github.com/oidc-mytoken/server">https://github.com/oidc-mytoken/server</a>
-</p>
-<p>
- On this web page you can easily obtain OpenID Connect access tokens. You can do the same on the command line with
- our
- <a href="https://github.com/oidc-mytoken/client">command line client</a>.
-</p>
-
-<script>
- let cookieLifetime = {{cookie-lifetime}};
-</script>
\ No newline at end of file
diff --git a/internal/server/web/static/css/mytoken-loggedin.css b/internal/server/web/static/css/mytoken-loggedin.css
deleted file mode 100644
index 628ca4fa..00000000
--- a/internal/server/web/static/css/mytoken-loggedin.css
+++ /dev/null
@@ -1,56 +0,0 @@
-.hover-text {
- display: none;
-}
-
-.hover-item:hover .hover-text {
- display: inline-block;
-}
-
-.hover-item:hover .non-hover-text {
- 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;
- }
-}
-
-.btn-copy {
- position: absolute;
- margin-top: -28px;
- right: -8px;
-}
-
-.btn-copy-inline {
- position: absolute;
- right: 8px;
-}
-
-#sshHostConfigCopy {
- margin-top: 0;
- right: 15px;
-}
-
-.btn-reload {
- position: absolute;
- margin-top: -28px;
- right: 14px;
-}
-
-.token-fold {
- cursor: pointer;
- user-select: none;
-}
\ No newline at end of file
diff --git a/internal/server/web/static/css/mytoken.css b/internal/server/web/static/css/mytoken.css
index 71720f64..9e409844 100644
--- a/internal/server/web/static/css/mytoken.css
+++ b/internal/server/web/static/css/mytoken.css
@@ -74,4 +74,61 @@ hr {
.svg-icon {
width: 1em;
height: 1em;
-}
\ No newline at end of file
+}
+
+.hover-text {
+ display: none;
+}
+
+.hover-item:hover .hover-text {
+ display: inline-block;
+}
+
+.hover-item:hover .non-hover-text {
+ 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;
+ }
+}
+
+.btn-copy {
+ position: absolute;
+ margin-top: -28px;
+ right: -8px;
+}
+
+.btn-copy-inline {
+ position: absolute;
+ right: 8px;
+}
+
+#sshHostConfigCopy {
+ margin-top: 0;
+ right: 15px;
+}
+
+.btn-reload {
+ position: absolute;
+ margin-top: -28px;
+ right: 14px;
+}
+
+.token-fold {
+ cursor: pointer;
+ user-select: none;
+}
diff --git a/internal/server/web/static/js/home-logged-in.js b/internal/server/web/static/js/home-logged-in.js
new file mode 100644
index 00000000..1e35b3fd
--- /dev/null
+++ b/internal/server/web/static/js/home-logged-in.js
@@ -0,0 +1,9 @@
+$(function () {
+ chainFunctions(
+ checkIfLoggedIn,
+ initAT,
+ initCreateMT,
+ initTokeninfo,
+ );
+ openCorrectTab();
+})
diff --git a/internal/server/web/static/js/home-not-logged-in.js b/internal/server/web/static/js/home-not-logged-in.js
new file mode 100644
index 00000000..76b08b28
--- /dev/null
+++ b/internal/server/web/static/js/home-not-logged-in.js
@@ -0,0 +1,7 @@
+$(function () {
+ chainFunctions(
+ initCreateMT,
+ initTokeninfo,
+ );
+ openCorrectTab();
+})
diff --git a/internal/server/web/static/js/home.js b/internal/server/web/static/js/home.js
index 7dc685c7..203feb71 100644
--- a/internal/server/web/static/js/home.js
+++ b/internal/server/web/static/js/home.js
@@ -1,10 +1,4 @@
-$(function () {
- chainFunctions(
- checkIfLoggedIn,
- initAT,
- initCreateMT,
- initTokeninfo,
- );
+function openCorrectTab() {
// https://stackoverflow.com/a/17552459
// Javascript to enable link to tab
let url = document.location.toString();
@@ -15,7 +9,7 @@ $(function () {
}
$('.nav-tabs a[href="#' + hash + '"]').tab('show');
}
-})
+}
// With HTML5 history API, we can easily prevent scrolling!
diff --git a/internal/server/web/static/js/logged-in-utils.js b/internal/server/web/static/js/logged-in-utils.js
deleted file mode 100644
index 60582dd3..00000000
--- a/internal/server/web/static/js/logged-in-utils.js
+++ /dev/null
@@ -1,8 +0,0 @@
-let clipboard = new ClipboardJS('.copier');
-clipboard.on('success', function (e) {
- e.clearSelection();
- let el = $(e.trigger);
- let originalText = el.attr('data-original-title');
- el.attr('data-original-title', 'Copied!').tooltip('show');
- el.attr('data-original-title', originalText);
-});
diff --git a/internal/server/web/static/js/utils.js b/internal/server/web/static/js/utils.js
index 2f53d772..63d7b643 100644
--- a/internal/server/web/static/js/utils.js
+++ b/internal/server/web/static/js/utils.js
@@ -109,4 +109,11 @@ function prefixId(id, prefix = "") {
return '#' + prefix + escapeSelector(id);
}
-
+let clipboard = new ClipboardJS('.copier');
+clipboard.on('success', function (e) {
+ e.clearSelection();
+ let el = $(e.trigger);
+ let originalText = el.attr('data-original-title');
+ el.attr('data-original-title', 'Copied!').tooltip('show');
+ el.attr('data-original-title', originalText);
+});
--
GitLab