doctype html
html
  head
    meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"
    meta charset="utf-8"
    meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport"

    link href="/favicon.png" rel="icon" type="image/png"
    link href="/favicon.ico" rel="icon"

    title = current_page.data.title || "InSpec"

    link rel='stylesheet' type='text/css' href='css/inspec_tutorial.css'

    == stylesheet_link_tag :site

  body class="#{page_classes}"
    = partial "layouts/global-message"

    .container
      = partial "layouts/nav"

      main#main-content
        == yield

    = partial "layouts/footer"

    script src='https://s3.amazonaws.com/menumaker/menumaker.min.js'
    script src='scripts/inspec_tutorial.js'
    script src='dist/inspec_tutorial.js'
    div inspec-tutorial="true" class="inspec-tutorial" hidden="true"
      = "Loading"

    == javascript_include_tag "all"
    
    javascript:
    
     //initiate sticky sidebar from jquery.sticky.js
    
      if (window.innerWidth > 640) { //don't fix on mobile
        $('#sidebar').stick_in_parent();
      }
    
    javascript:
    
      //Parallax Text
      
      if (window.innerWidth > 900) { //don't parallax on tablet/mobile
      $(window).enllax(); //initiate parallax on larger screens
      }
      
    javascript:
    
      //Code pop-up animation on homepage
      
      $('.code-trigger').click(function() {
        $(this).toggleClass('turn-angle');
        $('.code-pop').slideToggle(500);
      });
    
      
    javascript:
    
      //Animate HR on scroll
      
      $(window).scroll(function() {    

      var scroll = $(window).scrollTop();
      var objectSelect = $('#icon-trigger'); //parent that triggers scroll
      var objectPosition = objectSelect.offset().top;
      if (scroll > objectPosition) {
      $('hr.first').addClass('stretch')  //add class animate class to HR

      } 
      });
      
    javascript:
    
      //Animating progress bar for header
      
      $(document).ready(function(){
    
      var getMax = function(){
          return $(document).height() - $(window).height();
      }
      
      var getValue = function(){
          return $(window).scrollTop();
      }
      
      if('max' in document.createElement('progress')){
          // Browser supports progress element
          var progressBar = $('progress');
          
          // Set the Max attr for the first time
          progressBar.attr({ max: getMax() });

          $(document).on('scroll', function(){
              // On scroll only Value attr needs to be calculated
              progressBar.attr({ value: getValue() });
          });
        
          $(window).resize(function(){
              // On resize, both Max/Value attr needs to be calculated
              progressBar.attr({ max: getMax(), value: getValue() });
          });   
      }
      else {
          var progressBar = $('.progress-bar'), 
              max = getMax(), 
              value, width;
          
          var getWidth = function(){
              // Calculate width in percentage
              value = getValue();            
              width = (value/max) * 100;
              width = width + '%';
              return width;
          }
          
          var setWidth = function(){
              progressBar.css({ width: getWidth() });
          }
          
          $(document).on('scroll', setWidth);
          $(window).on('resize', function(){
              // Need to reset the Max attr
              max = getMax();
              setWidth();
          });
          }
        });
        
  
    javascript:
    

      $(document).foundation();
      $('.try-demo').click(function(event){
        event.stopPropagation();
        $('.inspec-tutorial').show()
        window.dispatchEvent(new Event('resizeTerminal'));
        $('.quit-inspec-tutorial').click(function(event){
          event.stopPropagation();
          $('.inspec-tutorial').hide()
        })
      });
        
     javascript:
       !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","page","once","off","on"];analytics.factory=function(t){return function(){var e=Array.prototype.slice.call(arguments);e.unshift(t);analytics.push(e);return analytics}};for(var t=0;t<analytics.methods.length;t++){var e=analytics.methods[t];analytics[e]=analytics.factory(e)}analytics.load=function(t){var e=document.createElement("script");e.type="text/javascript";e.async=!0;e.src=("https:"===document.location.protocol?"https://":"http://")+"cdn.segment.com/analytics.js/v1/"+t+"/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)};analytics.SNIPPET_VERSION="3.1.0";
         analytics.load("2NpoxZS2fnBmOgGdnQOymLNm6wuij13X");
         analytics.page()
       }}();