Skip to main content
  1. /*! Version 1.1 */
  2.  
  3. //On Load Scripts
  4. $(function() {
  5.  
  6. //Code View Functionality
  7. $('.code-view').click(function(){
  8. $('body').addClass('code');
  9. $('.site, .site-view').on('click.codeview',function(){
  10. return false;
  11. });
  12. return false;
  13. });
  14. $('.code-view').hover(function(){
  15. $('body').toggleClass('peek');
  16. });
  17. $('.site').hover(function(){
  18. $('body.code').toggleClass('rev-peek');
  19. });
  20. $('.site, .site-view').click(function(){
  21. $('body.code').removeClass('code rev-peek');
  22. $('.site, .site-view').off('click.codeview');
  23. })
  24. $('.navbar-nav li a').click(function(){
  25. $('body.code').removeClass('code rev-peek');
  26. $('.site, .site-view').off('click.codeview');
  27. })
  28.  
  29. //Close the nav when it is clicked
  30. $(function(){
  31. var navMain = $(".navbar-collapse");
  32. navMain.on("click", "a:not([data-toggle])", null, function () {
  33. navMain.collapse('hide');
  34. });
  35. });
  36.  
  37. //Modal initialization
  38. $('#site-mod').heliumModal({
  39. vert: 50, // Vertical position by percentage.
  40. speed: 500, // Speed for animations
  41. easing: 'swing', // Easing style for animations. use standard jquery easing options.
  42. onOpen: function(){ }, // callback before modal opens
  43. afterOpen: function(){ },// callback after modal opens
  44. onClose: function(){ }, // callback before modal closes
  45. afterClose: function(){ }// callback after modal closes
  46. });
  47.  
  48. //Modal content population
  49. $('.mod-link').click(function(event){
  50. if($(window).width() > 992){
  51. event.preventDefault();
  52. var modHTML = $(this).html();
  53. var modLink = $(this).attr('href');
  54. $('#site-mod .content').html(modHTML);
  55. if(!$('body.code').length){
  56. $('#site-mod').heliumModal('openModal');
  57. }
  58. }
  59. });
  60.  
  61. //Code View Parallax Effect
  62. function scrollIt(scrollElement){
  63. $(window).scroll(function(){
  64. var scrollEnd = scrollElement.outerHeight() - $(window).innerHeight();
  65. var pageEnd = $(document).height() - $(window).innerHeight();
  66. var currScroll = $(window).scrollTop();
  67. var currRatio = (currScroll / pageEnd);
  68. var newVal = scrollEnd * currRatio;
  69. scrollElement.css('transform','translate(0,-'+newVal+'px)');
  70. });
  71. }
  72.  
  73. // Load Code View Content
  74. $('#parallax-css').load('../code-css.php .prettyprint', function(event){
  75. $('#parallax-css pre').removeClass('mobile-code');
  76. runPrettyPrint();
  77. scrollIt($('#parallax-css pre'));
  78. });
  79. $('#parallax-html').load('../code-html.php .prettyprint', function(event){
  80. $('#parallax-html pre').removeClass('mobile-code');
  81. runPrettyPrint();
  82. scrollIt($('#parallax-html pre'));
  83. });
  84. $('#parallax-js').load('../code-js.php .prettyprint', function(event){
  85. $('#parallax-js pre').removeClass('mobile-code');
  86. runPrettyPrint();
  87. scrollIt($('#parallax-js pre'));
  88. });
  89.  
  90. //CSS-JS Toggle
  91. $('.code-toggle').click(function(){
  92. $('#parallax-css, #parallax-js').toggle();
  93. if($('#parallax-css:visible').length){
  94. $('.code-toggle span').html('JS');
  95. } else {
  96. $('.code-toggle span').html('SCSS');
  97. }
  98. return false;
  99. });
  100.  
  101. }); // End Document Ready
  102.  
  103. //Re-initialze prettyprint
  104. function runPrettyPrint(){
  105. PR.prettyPrint();
  106. }