Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use web component for header and footer. Add extra links to header #150

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 0 additions & 3 deletions build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -50,9 +50,6 @@ dependencies {
}

implementation("org.webjars:webjars-servlet-2.x:1.6")
implementation("org.webjars:jquery:3.6.1")
implementation("org.webjars:jquery-ui:1.13.2")
Comment on lines -53 to -54
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

one of these changes causes a browser console error, I assume the version of bootstrap relies on this (even if we aren't using that)

image

implementation("org.webjars.bower:fontawesome:4.7.0")

implementation("com.captcha:botdetect-jsp20:4.0.beta3")

Expand Down
248 changes: 25 additions & 223 deletions src/main/resources/org/jenkinsci/account/taglib/layout.jelly
Original file line number Diff line number Diff line change
Expand Up @@ -27,244 +27,46 @@
<meta content='${attrs.title}' property='og:title'/>
<meta content='article' property='og:type'/>
<meta content='Jenkins – Continuous Delivery for every team' property='og:description'/>
<link href='/webjars/fontawesome/4.7.0/css/font-awesome.min.css' media='screen' rel='stylesheet'/>
<link href='/style.css' media='screen' rel='stylesheet'/>
<link href='https://www.jenkins.io/assets/bower/bootstrap/css/bootstrap.min.css' media='screen' rel='stylesheet'/>
<link href='https://www.jenkins.io/assets/bower/tether/css/tether.min.css' media='screen' rel='stylesheet'/>
<link href='https://www.jenkins.io/css/font-icons.css' media='screen' rel='stylesheet'/>
<link href='https://www.jenkins.io/css/jenkins.css' media='screen' rel='stylesheet'/>
<!-- Non-obtrusive CSS styles -->
<link href='https://www.jenkins.io/assets/bower/ionicons/css/ionicons.min.css' media='screen' rel='stylesheet'/>
<link href='https://www.jenkins.io/css/footer.css' media='screen' rel='stylesheet'/>
<script src="/webjars/jquery/3.6.1/jquery.js"/>
<script src="/webjars/jquery-ui/1.13.2/jquery-ui.js"/>
</head>
<body style="min-height:100%; height:100%; padding-top:100px">
<script src="https://unpkg.com/@webcomponents/webcomponentsjs@2.6.0/webcomponents-loader.js"/>
<script src="https://unpkg.com/lit@2.4.0/polyfill-support.js"/>
<script data="jio" src="https://unpkg.com/@halkeye/jenkins-io-components?module" type="module"/>
<script data="jio" nomodule="" src="https://unpkg.com/@halkeye/jenkins-io-components"/>

<jio-navbar class="fixed-top" property="https://accounts.jenkins.io"/>

<div class='container pb-5' style="min-height:55%;">
<j:if test="${app.isLoggedIn() or it.isLoggedIn()}">
<nav class='navbar navbar-expand-md navbar-light' id="ji-toolbar">
<a class='navbar-brand' href='/'>
My Account
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"/>
</button>
<div class='collapse navbar-collapse' id='CollapsingNavbar2'>

<ul class='navbar-nav mr-auto'>
<j:if test="${it.isAdmin() or app.isAdmin()}">
<li class="nav-item">
<a href="/admin" class="active nav-link">Admin</a>
</li>
</j:if>
<li class="nav-item">
<a href="/myself" class="active nav-link">Profile</a>
</li>

<li class="nav-item">
<a href="/logout" class="active nav-link">
Logout
<i class="fa fa-sign-out" aria-hidden="true"/>
</a>
</li>
</ul>
</div>
</nav>
<jio-navbar class="fixed-top" property="https://accounts.jenkins.io">
<j:if test="${app.isLoggedIn() or it.isLoggedIn()}">
<div slot="rightMenuItems">
<j:if test="${it.isAdmin() or app.isAdmin()}">
<jio-navbar-link href="/admin">Admin</jio-navbar-link>
</j:if>
<jio-navbar-link href="/myself">Profile</jio-navbar-link>
<jio-navbar-link href="/logout">Logout <ion-icon name="log-out-outline" /></jio-navbar-link>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the ion-icon doesn't seem to be showing for me

image

</div>
</j:if>
</jio-navbar>

<d:invokeBody/>
</div>
<div class='container pb-5' style="min-height:64%;">
<d:invokeBody />
</div>

<script src='https://www.jenkins.io/assets/bower/anchor-js/anchor.min.js'></script>
<script src='https://www.jenkins.io/assets/bower/tether/js/tether.min.js'></script>
<script src='https://www.jenkins.io/assets/bower/bootstrap/js/bootstrap.min.js'></script>
<footer id='footer' style="position:absolute; width:100%">
<div class='container'>
<div class='row'>
<div class='col-md-4'>
<div class='license-box'>
<div id='creativecommons'>
<a href='https://creativecommons.org/licenses/by-sa/4.0/'>
<p>
<img src='https://licensebuttons.net/l/by-sa/4.0/88x31.png'/>
</p>
</a>
<p>
The content driving this site is licensed under the Creative
Commons Attribution-ShareAlike 4.0 license.
</p>
</div>
</div>
</div>
<div class='links col-md-8'>
<div class='container'>
<div class='row'>
<div class='area col-md-3'>
<div class='div-mar'>
<h5>Resources</h5>
<ul class='resources'>
<li>
<a href='https://www.jenkins.io/events'>
Events
</a>
</li>
<li>
<a href='https://www.jenkins.io/doc'>
Documentation
</a>
</li>
<li>
<a href='https://www.jenkins.io/node'>
Blog
</a>
</li>
</ul>
</div>
</div>
<div class='area col-md-3'>
<div class='div-mar'>
<h5>Solutions</h5>
<ul>
<li>
<a href='https://www.jenkins.io/solutions/android'>
Android
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/c'>
C/C++
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/docker'>
Docker
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/embedded'>
Embedded
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/github'>
GitHub
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/java'>
Java
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/pipeline'>
Continuous Delivery
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/python'>
Python
</a>
</li>
<li>
<a href='https://www.jenkins.io/solutions/ruby'>
Ruby
</a>
</li>
</ul>
</div>
</div>
<div class='area col-md-3'>
<div class='div-mar'>
<h5>Project</h5>
<ul class='project'>
<li>
<a href='https://issues.jenkins.io'>
Issue tracker
</a>
</li>
<li>
<a href='https://wiki.jenkins-ci.org'>
Wiki
</a>
</li>
<li>
<a href='https://github.com/jenkinsci'>
GitHub
</a>
</li>
<li>
<a href='https://ci.jenkins.io'>
Jenkins on Jenkins
</a>
</li>
</ul>
</div>
</div>
<div class='area col-md-3'>
<div class='div-mar'>
<h5>Community</h5>
<ul class='community'>
<li>
<a href='https://groups.google.com/forum/#!forum/jenkinsci-users'>
Users mailing list
</a>
</li>
<li>
<a href='https://groups.google.com/forum/#!forum/jenkinsci-dev'>
Developers mailing list
</a>
</li>
<li>
<a href='https://twitter.com/jenkinsci'>
Twitter
</a>
</li>
<li>
<a href='https://reddit.com/r/jenkinsci'>
Reddit
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
<jio-footer property="https://accounts.jenkins.io" />

ga('create', 'UA-4216293-5', 'auto');
ga('send', 'pageview');
ga('set', 'anonymizeIp', true);
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-4216293-5', 'auto');
ga('send', 'pageview');
ga('set', 'anonymizeIp', true);
</script>

</script>
<script async="" src="https://www.jenkins.io/assets/bower/bootstrap/js/bootstrap.min.js" />
<script async="" src="https://unpkg.com/@webcomponents/webcomponentsjs@2.6.0/webcomponents-loader.js" />
<script async="" src="https://unpkg.com/lit@2.4.0/polyfill-support.js" />
<script async="" data="jio" src="https://unpkg.com/@halkeye/jenkins-io-components?module" type="module" />
<script async="" data="jio" nomodule="" src="https://unpkg.com/@halkeye/jenkins-io-components" />
Comment on lines +67 to +68
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<script async="" data="jio" src="https://unpkg.com/@halkeye/jenkins-io-components?module" type="module" />
<script async="" data="jio" nomodule="" src="https://unpkg.com/@halkeye/jenkins-io-components" />
<script async="" data="jio" src="https://unpkg.com/@jenkinsci/jenkins-io-components?module" type="module" />
<script async="" data="jio" nomodule="" src="https://unpkg.com/@jenkinsci/jenkins-io-components" />


<script>
!function(d,s,id) {
var js, fjs=d.getElementsByTagName(s)[0];
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id=id;
js.src="//platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js,fjs);
}
}(document,"script","twitter-wjs");
</script>
</body>
</html>

Expand Down