You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

208 lines
3.2 KiB

  1. /* JS Document */
  2. /******************************
  3. [Table of Contents]
  4. 1. Vars and Inits
  5. 2. Set Header
  6. 3. Init Menu
  7. 4. Init Parallax
  8. 5. Init Google Map
  9. ******************************/
  10. $(document).ready(function()
  11. {
  12. "use strict";
  13. /*
  14. 1. Vars and Inits
  15. */
  16. var ctrl = new ScrollMagic.Controller();
  17. var header = $('.header');
  18. var menuActive = false;
  19. var hamb = $('.hamburger_container');
  20. var menu = $('.fs_menu_container');
  21. var hambIcon = $('.hamburger_icon');
  22. var map;
  23. setHeader();
  24. $(window).on('resize', function()
  25. {
  26. setHeader();
  27. });
  28. $(document).on('scroll', function()
  29. {
  30. setHeader();
  31. });
  32. initMenu();
  33. initParallax();
  34. initGoogleMap();
  35. /*
  36. 2. Set Header
  37. */
  38. function setHeader()
  39. {
  40. if(window.innerWidth < 992)
  41. {
  42. if($(window).scrollTop() > 100)
  43. {
  44. header.css({'height':"80"});
  45. }
  46. else
  47. {
  48. header.css({'height':"110"});
  49. }
  50. }
  51. else
  52. {
  53. if($(window).scrollTop() > 100)
  54. {
  55. header.css({'height':"80"});
  56. }
  57. else
  58. {
  59. header.css({'height':"110"});
  60. }
  61. }
  62. if(window.innerWidth > 991 && menuActive)
  63. {
  64. closeMenu();
  65. }
  66. }
  67. /*
  68. 3. Init Menu
  69. */
  70. function initMenu()
  71. {
  72. if($('.hamburger_container').length)
  73. {
  74. hamb.on('click', function()
  75. {
  76. if(!menuActive)
  77. {
  78. openMenu();
  79. }
  80. else
  81. {
  82. closeMenu();
  83. }
  84. });
  85. }
  86. }
  87. function openMenu()
  88. {
  89. menu.addClass('active');
  90. setTimeout(function()
  91. {
  92. hambIcon.addClass('active');
  93. },500);
  94. menuActive = true;
  95. }
  96. function closeMenu()
  97. {
  98. menu.removeClass('active');
  99. setTimeout(function()
  100. {
  101. hambIcon.removeClass('active');
  102. },500);
  103. menuActive = false;
  104. }
  105. /*
  106. 4. Init Parallax
  107. */
  108. function initParallax()
  109. {
  110. if($('.prlx_parent').length && $('.prlx').length)
  111. {
  112. var elements = $('.prlx_parent');
  113. elements.each(function()
  114. {
  115. var ele = this;
  116. var bcg = $(ele).find('.prlx');
  117. var slideParallaxScene = new ScrollMagic.Scene({
  118. triggerElement: ele,
  119. triggerHook: 1,
  120. duration: "200%"
  121. })
  122. .setTween(TweenMax.from(bcg, 1, {y: '-30%', ease:Power0.easeNone}))
  123. .addTo(ctrl);
  124. });
  125. }
  126. }
  127. /*
  128. 5. Init Google Map
  129. */
  130. function initGoogleMap()
  131. {
  132. var myLatlng = new google.maps.LatLng(36.138101,-5.355313);
  133. var mapOptions =
  134. {
  135. center: myLatlng,
  136. zoom: 17,
  137. mapTypeId: google.maps.MapTypeId.ROADMAP,
  138. draggable: true,
  139. scrollwheel: false,
  140. zoomControl: true,
  141. zoomControlOptions:
  142. {
  143. position: google.maps.ControlPosition.RIGHT_CENTER
  144. },
  145. mapTypeControl: false,
  146. scaleControl: false,
  147. streetViewControl: false,
  148. rotateControl: false,
  149. fullscreenControl: true,
  150. styles:[]
  151. }
  152. // Initialize a map with options
  153. map = new google.maps.Map(document.getElementById('map'), mapOptions);
  154. // Use an image for a marker
  155. var image = 'images/map_marker.png';
  156. var marker = new google.maps.Marker(
  157. {
  158. position: new google.maps.LatLng(36.138101,-5.355313),
  159. map: map,
  160. icon: image
  161. });
  162. // Re-center map after window resize
  163. google.maps.event.addDomListener(window, 'resize', function()
  164. {
  165. setTimeout(function()
  166. {
  167. google.maps.event.trigger(map, "resize");
  168. map.setCenter(myLatlng);
  169. }, 1400);
  170. });
  171. }
  172. });