mirror of https://github.com/istio/istio.io.git
338 lines
10 KiB
JavaScript
338 lines
10 KiB
JavaScript
---
|
|
---
|
|
|
|
// Youtube Player API
|
|
// create script tag and add to DOM
|
|
var tag = document.createElement('script');
|
|
tag.src = "https://www.youtube.com/iframe_api";
|
|
var firstScriptTag = document.getElementsByTagName('script')[0];
|
|
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
|
|
|
|
// Array of videoIds
|
|
// The key corresponds to the data attributes in about/index.html
|
|
var playerInfoList = [
|
|
{type: 'yt', key: 'UOIJNygDNlE'},
|
|
{type: 'yt', key: 'nz-LcdoMYWA'},
|
|
{type: 'yt', key: 'sZx3oZt7LVg'},
|
|
{type: 'yt', key: 'RvUP7vX2P4s'},
|
|
{type: 'slideshare', key: 'http://www.slideshare.net/sujatatibre/g-rpc-talk-with-intel-3'},
|
|
{type: 'slideshare', key: 'http://www.slideshare.net/VarunTalwar4/grpc-design-and-implementation'},
|
|
{type: 'slideshare', key: 'http://www.slideshare.net/VarunTalwar4/grpc-overview'},
|
|
{type: 'slideshare', key: 'http://www.ustream.tv/recorded/86187859'}
|
|
];
|
|
|
|
function createPlayer(key) {
|
|
$('#player').append('<iframe id="ytplayer" type="text/html" width="640" height="390" src="https://www.youtube.com/embed/'+key+'" frameborder="0" allowfullscreen>');
|
|
}
|
|
|
|
// click event for presentations/talks in about
|
|
$('.pt').on('click', function() {
|
|
var self = this,
|
|
video = playerInfoList.filter(function(obj) {
|
|
return obj.key == $(self).data('key');
|
|
})[0];
|
|
|
|
|
|
if (video.type == 'yt') {
|
|
createPlayer(video.key);
|
|
} else {
|
|
window.open(video.key);
|
|
}
|
|
|
|
resizePlayer();
|
|
$('#player iframe').on('load', function() {
|
|
$('.pt-lightbox').addClass('active');
|
|
});
|
|
});
|
|
|
|
|
|
// Close lightbox when clicking anywhere on overlay
|
|
$('.pt-lightbox').on('click', function() {
|
|
if ($(this).hasClass('active')) {
|
|
$(this).removeClass('active');
|
|
$(this).find('iframe').remove();
|
|
$('body, html').removeClass('noscroll');
|
|
}
|
|
});
|
|
|
|
// Resize Player
|
|
function resizePlayer() {
|
|
var $inner = $('.pt-player'),
|
|
defaultHeight = window.innerHeight || document.documentElement.clientHeight,
|
|
defaultWidth = window.innerWidth || document.documentElement.clientWidth,
|
|
maxHeight = defaultHeight*.75,
|
|
maxWidth = defaultWidth*.75,
|
|
newWidth = maxWidth,
|
|
newHeight = 16 * maxWidth / 9;
|
|
|
|
if (defaultWidth > defaultHeight){
|
|
if (newHeight > maxHeight){
|
|
newWidth = 16 * maxHeight / 9;
|
|
newHeight = maxHeight;
|
|
}
|
|
} else {
|
|
newWidth = 16 * maxHeight / 9;
|
|
newHeight = maxHeight;
|
|
if (newWidth > maxWidth){
|
|
newHeight = 9 * maxWidth / 16;
|
|
newWidth = maxWidth;
|
|
}
|
|
}
|
|
|
|
$inner.css({"width": newWidth, "height": newHeight});
|
|
}
|
|
|
|
|
|
|
|
// Jquery UI for tabbed panes
|
|
$.getScript("https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js", function(){
|
|
setupTabs();
|
|
});
|
|
|
|
// Add the 'external' class to every outbound link on the site.
|
|
// The css will add a small right arrow after the link.
|
|
$('a').filter(function() {
|
|
return this.hostname && this.hostname !== location.hostname;
|
|
}).addClass("external");
|
|
|
|
//Set up tabs
|
|
function setupTabs(rootElement) {
|
|
rootElement = rootElement || document;
|
|
var tabs = $(rootElement).find('div.tabs');
|
|
if(tabs.length > 0) {
|
|
tabs.tabs();
|
|
}
|
|
};
|
|
|
|
// Make the table of contents
|
|
$(document).ready(function() {
|
|
var $window = $(window);
|
|
|
|
// Sticky Nav on Scroll Up
|
|
var iScrollPos = 0;
|
|
|
|
$window.scroll(function () {
|
|
var iCurScrollPos = $(this).scrollTop();
|
|
if (iCurScrollPos > iScrollPos) {
|
|
//Scrolling Down
|
|
if ($('#sticky-nav').visible()){
|
|
$('#sticky-nav').removeClass("on-page");
|
|
}
|
|
} else {
|
|
//Scrolling Up
|
|
if ($('.nav-hero-container').visible(true) && $('#sticky-nav').visible()){
|
|
$('#sticky-nav').removeClass("on-page");
|
|
} else if (!$('.nav-hero-container').visible(true)) {
|
|
$('#sticky-nav').addClass("on-page");
|
|
}
|
|
}
|
|
iScrollPos = iCurScrollPos;
|
|
});
|
|
|
|
$('.toc').click(function(){
|
|
setTimeout(function(){
|
|
$('#sticky-nav').addClass("on-page");
|
|
}, 1000)
|
|
});
|
|
|
|
setTimeout(function(){
|
|
if (document.URL.indexOf("#") != -1 && document.URL.indexOf("contribute") == -1 ) {
|
|
$('#sticky-nav').addClass("on-page");
|
|
}
|
|
}, 1000);
|
|
|
|
// Scroll to sections
|
|
$('.btn-floating').on('click', function(){
|
|
$('html, body').scrollTo(('#' +($(this).data("target"))), 350);
|
|
})
|
|
|
|
// Invoke slick JS carousel
|
|
// Detailed documentation: http://kenwheeler.github.io/slick/
|
|
$('.pt-container').slick({
|
|
arrows: true,
|
|
dots: false,
|
|
autoplay: false,
|
|
infinite: true,
|
|
slidesToShow: 4,
|
|
slidesToScroll: 1,
|
|
responsive: [
|
|
{
|
|
breakpoint: 1024,
|
|
settings: {
|
|
slidesToShow: 3,
|
|
dots: false,
|
|
arrows: true
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 800,
|
|
settings: {
|
|
slidesToShow: 3,
|
|
dots: true,
|
|
arrows: false
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 600,
|
|
settings: {
|
|
slidesToShow: 2,
|
|
dots: true,
|
|
arrows: false
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 480,
|
|
settings: {
|
|
slidesToShow: 1,
|
|
dots: true,
|
|
arrows: false
|
|
}
|
|
}
|
|
]
|
|
});
|
|
|
|
$('.slick-next').on('click', function() {
|
|
$('.slick-prev').addClass('active');
|
|
});
|
|
|
|
$('.toc').toc({ listType: 'ul' });
|
|
|
|
$('.nav-toggle, .hamburger').on('click', function(){
|
|
$('.top-nav').toggleClass('right');
|
|
});
|
|
|
|
$('.nav-doc-toggle').on('click', function(){
|
|
$('.doc-list').toggleClass('active');
|
|
});
|
|
|
|
$(window).on('resize',function(){
|
|
//send resize event to slick after it's been destroyed
|
|
$('.pt-container').slick('resize');
|
|
|
|
//reset event listener on resize
|
|
$('.slick-next').on('click', function() {
|
|
$('.slick-prev').addClass('active');
|
|
});
|
|
|
|
if ($(window).width() >= 768 && !($('.top-nav').hasClass('right'))) {
|
|
$('.top-nav').addClass('right');
|
|
}
|
|
});
|
|
|
|
$('.toggle').on('click',function(){
|
|
$(this).toggleClass('active');
|
|
});
|
|
|
|
var forwarding = window.location.hash.replace("#","");
|
|
if (forwarding) {
|
|
$("#generalInstructions").hide();
|
|
$("#continueEdit").show();
|
|
$("#continueEditButton").text("Edit " + forwarding);
|
|
$("#continueEditButton").attr("href", "{{ site.githuburl }}edit/master/" + forwarding)
|
|
} else {
|
|
$("#generalInstructions").show();
|
|
$("#continueEdit").hide();
|
|
}
|
|
});
|
|
|
|
// Prettyprint
|
|
$('pre').addClass("prettyprint");
|
|
$.getScript("https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js", function(){
|
|
});
|
|
|
|
// Collapsible navbar menu, using https://github.com/jordnkr/collapsible
|
|
$.getScript("/grpc.github.io/js/jquery.collapsible.js", function(){
|
|
highlightActive();
|
|
$('.submenu').collapsible();
|
|
});
|
|
|
|
// TOC script
|
|
// https://github.com/ghiculescu/jekyll-table-of-contents
|
|
(function($){
|
|
$.fn.toc = function(options) {
|
|
var defaults = {
|
|
noBackToTopLinks: false,
|
|
title: '',
|
|
minimumHeaders: 2,
|
|
headers: 'h1, h2, h3, h4, h5, h6',
|
|
listType: 'ol', // values: [ol|ul]
|
|
showEffect: 'show', // values: [show|slideDown|fadeIn|none]
|
|
showSpeed: 'slow' // set to 0 to deactivate effect
|
|
},
|
|
settings = $.extend(defaults, options);
|
|
|
|
function fixedEncodeURIComponent (str) {
|
|
return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
|
|
return '%' + c.charCodeAt(0).toString(16);
|
|
});
|
|
}
|
|
|
|
var headers = $(settings.headers).filter(function() {
|
|
// get all headers with an ID
|
|
var previousSiblingName = $(this).prev().attr( "name" );
|
|
if (!this.id && previousSiblingName) {
|
|
this.id = $(this).attr( "id", previousSiblingName.replace(/\./g, "-") );
|
|
}
|
|
return this.id;
|
|
}), output = $(this);
|
|
if (!headers.length || headers.length < settings.minimumHeaders || !output.length) {
|
|
return;
|
|
}
|
|
|
|
if (0 === settings.showSpeed) {
|
|
settings.showEffect = 'none';
|
|
}
|
|
|
|
var render = {
|
|
show: function() { output.hide().html(html).show(settings.showSpeed); },
|
|
slideDown: function() { output.hide().html(html).slideDown(settings.showSpeed); },
|
|
fadeIn: function() { output.hide().html(html).fadeIn(settings.showSpeed); },
|
|
none: function() { output.html(html); }
|
|
};
|
|
|
|
var get_level = function(ele) { return parseInt(ele.nodeName.replace("H", ""), 10); }
|
|
var highest_level = headers.map(function(_, ele) { return get_level(ele); }).get().sort()[0];
|
|
var return_to_top = '<i class="icon-arrow-up back-to-top"> </i>';
|
|
|
|
var level = get_level(headers[0]),
|
|
this_level,
|
|
html = settings.title + " <"+settings.listType+">";
|
|
headers.on('click', function() {
|
|
if (!settings.noBackToTopLinks) {
|
|
window.location.hash = this.id;
|
|
}
|
|
})
|
|
.addClass('clickable-header')
|
|
.each(function(_, header) {
|
|
this_level = get_level(header);
|
|
if (!settings.noBackToTopLinks && this_level === highest_level) {
|
|
$(header).addClass('top-level-header').after(return_to_top);
|
|
}
|
|
if (this_level === level) // same level as before; same indenting
|
|
html += "<li><a href='#" + fixedEncodeURIComponent(header.id) + "'>" + header.innerHTML + "</a>";
|
|
else if (this_level <= level){ // higher level than before; end parent ol
|
|
for(i = this_level; i < level; i++) {
|
|
html += "</li></"+settings.listType+">"
|
|
}
|
|
html += "<li><a href='#" + fixedEncodeURIComponent(header.id) + "'>" + header.innerHTML + "</a>";
|
|
}
|
|
else if (this_level > level) { // lower level than before; expand the previous to contain a ol
|
|
for(i = this_level; i > level; i--) {
|
|
html += "<"+settings.listType+"><li>"
|
|
}
|
|
html += "<a href='#" + fixedEncodeURIComponent(header.id) + "'>" + header.innerHTML + "</a>";
|
|
}
|
|
level = this_level; // update for the next one
|
|
});
|
|
html += "</"+settings.listType+">";
|
|
if (!settings.noBackToTopLinks) {
|
|
$(document).on('click', '.back-to-top', function() {
|
|
$(window).scrollTop(0);
|
|
window.location.hash = '';
|
|
});
|
|
}
|
|
|
|
render[settings.showEffect]();
|
|
};
|
|
})(jQuery);
|