Fix a few bugs and add a feature. (#1111)

- Link injection for document headers has been broken for a while due to my
misunderstanding of the "for in" syntax in JavaScript. This now works as expected.

- Same problem also prevented the feature that causes every link to outside of istio.io
to be opened in a separate window. This now works as intended.

- Made the gear dropdown menu be right-aligned such that it doesn't go off-screen on
portrait mode tablets.

- Stop importing Popper.js since it's only needed for dropdown menus that aren't in the
nav bar. Ours is in a nav bar...

- Added link injection for <dt> terms, which makes it easy to create links to individual glossary entries.
This commit is contained in:
Martin Taillefer 2018-03-28 09:00:14 -07:00 committed by GitHub
parent a2b27b6222
commit 33bdfdc942
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 36 additions and 16 deletions

View File

@ -48,7 +48,7 @@
<i style="width: 1em" class='fa fa-lg fa-cog'></i>
</a>
<ul class="dropdown-menu" aria-labelledby="gearDropdown">
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="gearDropdown">
{% assign future_release = true %}
{% for rel in site.data.releases %}

View File

@ -90,7 +90,6 @@ layout: compress
<!-- libraries we pull in -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>
<script src="https://www.google.com/cse/brand?form=searchbox"></script>

View File

@ -291,7 +291,8 @@ h2:hover .header-link,
h3:hover .header-link,
h4:hover .header-link,
h5:hover .header-link,
h6:hover .header-link {
h6:hover .header-link,
dt:hover .header-link {
transition: opacity .4s ease-in-out;
opacity: 1;
}

View File

@ -116,28 +116,47 @@ function patchDOM() {
});
}
function attachLink(node) {
var i = document.createElement("i");
i.className = "fa fa-link";
var anchor = document.createElement("a");
anchor.className = "header-link";
anchor.href = "#" + node.id;
anchor.appendChild(i);
node.appendChild(anchor);
}
// Add a link icon next to each header so people can easily get bookmarks to headers
function attachLinksToHeaders() {
for (var level = 1; level <= 6; level++) {
for (var header in document.getElementsByTagName("h" + level)) {
if (typeof header.id !== "undefined" && header.id !== "") {
var i = document.createElement("i");
i.className = "fa fa-link";
var anchor = document.createElement("a");
anchor.className = "header-link";
anchor.href = "#" + header.id;
anchor.appendChild(i);
header.appendChild(anchor);
var headers = document.getElementsByTagName("h" + level);
for (var i = 0; i < headers.length; i++) {
var header = headers[i]
if (header.id !== "") {
attachLink(header);
}
}
}
}
// Add a link icon next to each define term so people can easily get bookmarks to them in the glossary
function attachLinksToDefinedTerms() {
var terms = document.getElementsByTagName("dt");
for (var i = 0; i < terms.length; i++) {
var term = terms[i]
if (term.id !== "") {
attachLink(term);
}
}
}
// Make it so each link outside of the current domain opens up in a different window
function makeOutsideLinksOpenInTabs() {
for (var link in document.getElementsByTagName("a")) {
var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
var link = links[i];
if (link.hostname && link.hostname != location.hostname) {
link.setAttribute("target", "_blank")
}
@ -163,6 +182,7 @@ function patchDOM() {
attachCopyButtons();
attachLinksToHeaders();
attachLinksToDefinedTerms();
makeOutsideLinksOpenInTabs();
loadExternalPreBlocks();
}

2
js/misc.min.js vendored
View File

@ -1,4 +1,4 @@
---
---
{% include home.html %}
'use strict';function doSearch(){var a='{{home}}/search.html?q='+document.getElementsByName('q')[0].value;window.location.assign(a)}$(function(a){a(document).ready(function(){a('.btn-search').on('click',function(b){b.preventDefault(),doSearch()}),a('[data-toggle="offcanvas"]').on('click',function(){a('.row-offcanvas').toggleClass('active'),a(this).children('i.fa').toggleClass('fa-chevron-right'),a(this).children('i.fa').toggleClass('fa-chevron-left')}),a(document).on('click','.tree-toggle',function(){a(this).children('i.fa').toggleClass('fa-caret-right'),a(this).children('i.fa').toggleClass('fa-caret-down'),a(this).parent().children('ul.tree').toggle(200)}),a(document).on('mouseenter','pre',function(){a(this).next().toggleClass('copy-show',!0),a(this).next().toggleClass('copy-hide',!1)}),a(document).on('mouseleave','pre',function(){a(this).next().toggleClass('copy-show',!1),a(this).next().toggleClass('copy-hide',!0)}),a(document).on('mouseenter','button.copy',function(){a(this).toggleClass('copy-show',!0),a(this).toggleClass('copy-hide',!1)}),a(document).on('mouseleave','button.copy',function(){a(this).toggleClass('copy-show',!1),a(this).toggleClass('copy-hide',!0)})})}(jQuery));function patchDOM(){(function(){for(var h,f=document.getElementsByTagName('PRE'),g=0;g<f.length;g++){h=document.createElement('BUTTON'),h.title='Copy to clipboard',h.className='copy copy-hide',h.innerText='Copy';var j=f[g].parentElement;if('DIV'==j.tagName)j.appendChild(h);else{var k=document.createElement('DIV');k.className='highlight',j.insertBefore(k,f[g]),k.appendChild(f[g]),k.appendChild(h)}}var l=new Clipboard('button.copy',{target:function(m){return m.previousElementSibling}});l.on('success',function(m){m.clearSelection(),m.trigger.textContent='Done',window.setTimeout(function(){m.trigger.textContent='Copy'},2e3)}),l.on('error',function(m){m.trigger.textContent='Not supported',window.setTimeout(function(){m.trigger.textContent='Copy'},5e3)})})(),function(){for(var f=1;6>=f;f++)for(var g in document.getElementsByTagName('h'+f))if('undefined'!=typeof g.id&&''!==g.id){var h=document.createElement('i');h.className='fa fa-link';var j=document.createElement('a');j.className='header-link',j.href='#'+g.id,j.appendChild(h),g.appendChild(j)}}(),function(){for(var f in document.getElementsByTagName('a'))f.hostname&&f.hostname!=location.hostname&&f.setAttribute('target','_blank')}(),function(){function f(j,k){fetch(k).then(l=>l.text()).then(l=>{j.firstChild.innerText=l})}for(var g=document.getElementsByTagName('PRE'),h=0;h<g.length;h++)g[h].hasAttribute('data-src')&&f(g[h],g[h].getAttribute('data-src'))}()}document.addEventListener('DOMContentLoaded',patchDOM);
'use strict';function doSearch(){var a='{{home}}/search.html?q='+document.getElementsByName('q')[0].value;window.location.assign(a)}$(function(a){a(document).ready(function(){a('.btn-search').on('click',function(b){b.preventDefault(),doSearch()}),a('[data-toggle="offcanvas"]').on('click',function(){a('.row-offcanvas').toggleClass('active'),a(this).children('i.fa').toggleClass('fa-chevron-right'),a(this).children('i.fa').toggleClass('fa-chevron-left')}),a(document).on('click','.tree-toggle',function(){a(this).children('i.fa').toggleClass('fa-caret-right'),a(this).children('i.fa').toggleClass('fa-caret-down'),a(this).parent().children('ul.tree').toggle(200)}),a(document).on('mouseenter','pre',function(){a(this).next().toggleClass('copy-show',!0),a(this).next().toggleClass('copy-hide',!1)}),a(document).on('mouseleave','pre',function(){a(this).next().toggleClass('copy-show',!1),a(this).next().toggleClass('copy-hide',!0)}),a(document).on('mouseenter','button.copy',function(){a(this).toggleClass('copy-show',!0),a(this).toggleClass('copy-hide',!1)}),a(document).on('mouseleave','button.copy',function(){a(this).toggleClass('copy-show',!1),a(this).toggleClass('copy-hide',!0)})})}(jQuery));function patchDOM(){function b(h){var j=document.createElement('i');j.className='fa fa-link';var k=document.createElement('a');k.className='header-link',k.href='#'+h.id,k.appendChild(j),h.appendChild(k)}(function(){for(var k,h=document.getElementsByTagName('PRE'),j=0;j<h.length;j++){k=document.createElement('BUTTON'),k.title='Copy to clipboard',k.className='copy copy-hide',k.innerText='Copy';var l=h[j].parentElement;if('DIV'==l.tagName)l.appendChild(k);else{var m=document.createElement('DIV');m.className='highlight',l.insertBefore(m,h[j]),m.appendChild(h[j]),m.appendChild(k)}}var n=new Clipboard('button.copy',{target:function(o){return o.previousElementSibling}});n.on('success',function(o){o.clearSelection(),o.trigger.textContent='Done',window.setTimeout(function(){o.trigger.textContent='Copy'},2e3)}),n.on('error',function(o){o.trigger.textContent='Not supported',window.setTimeout(function(){o.trigger.textContent='Copy'},5e3)})})(),function(){for(var j,h=1;6>=h;h++){j=document.getElementsByTagName('h'+h);for(var l,k=0;k<j.length;k++)l=j[k],''!==l.id&&b(l)}}(),function(){for(var k,h=document.getElementsByTagName('dt'),j=0;j<h.length;j++)k=h[j],''!==k.id&&b(k)}(),function(){for(var k,h=document.getElementsByTagName('a'),j=0;j<h.length;j++)k=h[j],k.hostname&&k.hostname!=location.hostname&&k.setAttribute('target','_blank')}(),function(){function h(l,m){fetch(m).then(n=>n.text()).then(n=>{l.firstChild.innerText=n})}for(var j=document.getElementsByTagName('PRE'),k=0;k<j.length;k++)j[k].hasAttribute('data-src')&&h(j[k],j[k].getAttribute('data-src'))}()}document.addEventListener('DOMContentLoaded',patchDOM);