scripts.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398
  1. /* Template: Tivo - SaaS App HTML Landing Page Template
  2. Author: Inovatik
  3. Created: Sep 2019
  4. Description: Custom JS file
  5. */
  6. (function($) {
  7. "use strict";
  8. /* Preloader */
  9. $(window).on('load', function() {
  10. var preloaderFadeOutTime = 500;
  11. function hidePreloader() {
  12. var preloader = $('.spinner-wrapper');
  13. setTimeout(function() {
  14. preloader.fadeOut(preloaderFadeOutTime);
  15. }, 500);
  16. }
  17. hidePreloader();
  18. });
  19. /* Navbar Scripts */
  20. // jQuery to collapse the navbar on scroll
  21. $(window).on('scroll load', function() {
  22. if ($(".navbar").offset().top > 60) {
  23. $(".fixed-top").addClass("top-nav-collapse");
  24. } else {
  25. $(".fixed-top").removeClass("top-nav-collapse");
  26. }
  27. });
  28. // jQuery for page scrolling feature - requires jQuery Easing plugin
  29. $(function() {
  30. $(document).on('click', 'a.page-scroll', function(event) {
  31. var $anchor = $(this);
  32. $('html, body').stop().animate({
  33. scrollTop: $($anchor.attr('href')).offset().top
  34. }, 600, 'easeInOutExpo');
  35. event.preventDefault();
  36. });
  37. });
  38. // closes the responsive menu on menu item click
  39. $(".navbar-nav li a").on("click", function(event) {
  40. if (!$(this).parent().hasClass('dropdown'))
  41. $(".navbar-collapse").collapse('hide');
  42. });
  43. /* Image Slider - Swiper */
  44. var imageSlider = new Swiper('.image-slider', {
  45. autoplay: {
  46. delay: 2000,
  47. disableOnInteraction: false
  48. },
  49. loop: true,
  50. spaceBetween: 30,
  51. slidesPerView: 5,
  52. breakpoints: {
  53. // when window is <= 580px
  54. 580: {
  55. slidesPerView: 1,
  56. spaceBetween: 10
  57. },
  58. // when window is <= 768px
  59. 768: {
  60. slidesPerView: 2,
  61. spaceBetween: 20
  62. },
  63. // when window is <= 992px
  64. 992: {
  65. slidesPerView: 3,
  66. spaceBetween: 20
  67. },
  68. // when window is <= 1200px
  69. 1200: {
  70. slidesPerView: 4,
  71. spaceBetween: 20
  72. },
  73. }
  74. });
  75. /* Text Slider - Swiper */
  76. var textSlider = new Swiper('.text-slider', {
  77. autoplay: {
  78. delay: 6000,
  79. disableOnInteraction: false
  80. },
  81. loop: true,
  82. navigation: {
  83. nextEl: '.swiper-button-next',
  84. prevEl: '.swiper-button-prev'
  85. }
  86. });
  87. /* Video Lightbox - Magnific Popup */
  88. $('.popup-youtube, .popup-vimeo').magnificPopup({
  89. disableOn: 700,
  90. type: 'iframe',
  91. mainClass: 'mfp-fade',
  92. removalDelay: 160,
  93. preloader: false,
  94. fixedContentPos: false,
  95. iframe: {
  96. patterns: {
  97. youtube: {
  98. index: 'youtube.com/',
  99. id: function(url) {
  100. var m = url.match(/[\\?\\&]v=([^\\?\\&]+)/);
  101. if ( !m || !m[1] ) return null;
  102. return m[1];
  103. },
  104. src: 'https://www.youtube.com/embed/%id%?autoplay=1'
  105. },
  106. vimeo: {
  107. index: 'vimeo.com/',
  108. id: function(url) {
  109. var m = url.match(/(https?:\/\/)?(www.)?(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/);
  110. if ( !m || !m[5] ) return null;
  111. return m[5];
  112. },
  113. src: 'https://player.vimeo.com/video/%id%?autoplay=1'
  114. }
  115. }
  116. }
  117. });
  118. /* Details Lightbox - Magnific Popup */
  119. $('.popup-with-move-anim').magnificPopup({
  120. type: 'inline',
  121. fixedContentPos: false, /* keep it false to avoid html tag shift with margin-right: 17px */
  122. fixedBgPos: true,
  123. overflowY: 'auto',
  124. closeBtnInside: true,
  125. preloader: false,
  126. midClick: true,
  127. removalDelay: 300,
  128. mainClass: 'my-mfp-slide-bottom'
  129. });
  130. /* Move Form Fields Label When User Types */
  131. // for input and textarea fields
  132. $("input, textarea").keyup(function(){
  133. if ($(this).val() != '') {
  134. $(this).addClass('notEmpty');
  135. } else {
  136. $(this).removeClass('notEmpty');
  137. }
  138. });
  139. /* Sign Up Form */
  140. $("#signUpForm").validator().on("submit", function(event) {
  141. if (event.isDefaultPrevented()) {
  142. // handle the invalid form...
  143. sformError();
  144. ssubmitMSG(false, "Please fill all fields!");
  145. } else {
  146. // everything looks good!
  147. event.preventDefault();
  148. ssubmitForm();
  149. }
  150. });
  151. function ssubmitForm() {
  152. // initiate variables with form content
  153. var email = $("#semail").val();
  154. var name = $("#sname").val();
  155. var password = $("#spassword").val();
  156. var terms = $("#sterms").val();
  157. $.ajax({
  158. type: "POST",
  159. url: "php/signupform-process.php",
  160. data: "email=" + email + "&name=" + name + "&password=" + password + "&terms=" + terms,
  161. success: function(text) {
  162. if (text == "success") {
  163. sformSuccess();
  164. } else {
  165. sformError();
  166. ssubmitMSG(false, text);
  167. }
  168. }
  169. });
  170. }
  171. function sformSuccess() {
  172. $("#signUpForm")[0].reset();
  173. ssubmitMSG(true, "Sign Up Submitted!");
  174. $("input").removeClass('notEmpty'); // resets the field label after submission
  175. }
  176. function sformError() {
  177. $("#signUpForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
  178. $(this).removeClass();
  179. });
  180. }
  181. function ssubmitMSG(valid, msg) {
  182. if (valid) {
  183. var msgClasses = "h3 text-center tada animated";
  184. } else {
  185. var msgClasses = "h3 text-center";
  186. }
  187. $("#smsgSubmit").removeClass().addClass(msgClasses).text(msg);
  188. }
  189. /* Log In Form */
  190. $("#logInForm").validator().on("submit", function(event) {
  191. if (event.isDefaultPrevented()) {
  192. // handle the invalid form...
  193. lformError();
  194. lsubmitMSG(false, "Please fill all fields!");
  195. } else {
  196. // everything looks good!
  197. event.preventDefault();
  198. lsubmitForm();
  199. }
  200. });
  201. function lsubmitForm() {
  202. // initiate variables with form content
  203. var email = $("#lemail").val();
  204. var password = $("#lpassword").val();
  205. $.ajax({
  206. type: "POST",
  207. url: "php/loginform-process.php",
  208. data: "email=" + email + "&password=" + password,
  209. success: function(text) {
  210. if (text == "success") {
  211. lformSuccess();
  212. } else {
  213. lformError();
  214. lsubmitMSG(false, text);
  215. }
  216. }
  217. });
  218. }
  219. function lformSuccess() {
  220. $("#logInForm")[0].reset();
  221. lsubmitMSG(true, "Log In Submitted!");
  222. $("input").removeClass('notEmpty'); // resets the field label after submission
  223. }
  224. function lformError() {
  225. $("#logInForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
  226. $(this).removeClass();
  227. });
  228. }
  229. function lsubmitMSG(valid, msg) {
  230. if (valid) {
  231. var msgClasses = "h3 text-center tada animated";
  232. } else {
  233. var msgClasses = "h3 text-center";
  234. }
  235. $("#lmsgSubmit").removeClass().addClass(msgClasses).text(msg);
  236. }
  237. /* Newsletter Form */
  238. $("#newsletterForm").validator().on("submit", function(event) {
  239. if (event.isDefaultPrevented()) {
  240. // handle the invalid form...
  241. nformError();
  242. nsubmitMSG(false, "Please fill all fields!");
  243. } else {
  244. // everything looks good!
  245. event.preventDefault();
  246. nsubmitForm();
  247. }
  248. });
  249. function nsubmitForm() {
  250. // initiate variables with form content
  251. var email = $("#nemail").val();
  252. var terms = $("#nterms").val();
  253. $.ajax({
  254. type: "POST",
  255. url: "php/newsletterform-process.php",
  256. data: "email=" + email + "&terms=" + terms,
  257. success: function(text) {
  258. if (text == "success") {
  259. nformSuccess();
  260. } else {
  261. nformError();
  262. nsubmitMSG(false, text);
  263. }
  264. }
  265. });
  266. }
  267. function nformSuccess() {
  268. $("#newsletterForm")[0].reset();
  269. nsubmitMSG(true, "Subscribed!");
  270. $("input").removeClass('notEmpty'); // resets the field label after submission
  271. }
  272. function nformError() {
  273. $("#newsletterForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
  274. $(this).removeClass();
  275. });
  276. }
  277. function nsubmitMSG(valid, msg) {
  278. if (valid) {
  279. var msgClasses = "h3 text-center tada animated";
  280. } else {
  281. var msgClasses = "h3 text-center";
  282. }
  283. $("#nmsgSubmit").removeClass().addClass(msgClasses).text(msg);
  284. }
  285. /* Privacy Form */
  286. $("#privacyForm").validator().on("submit", function(event) {
  287. if (event.isDefaultPrevented()) {
  288. // handle the invalid form...
  289. pformError();
  290. psubmitMSG(false, "Please fill all fields!");
  291. } else {
  292. // everything looks good!
  293. event.preventDefault();
  294. psubmitForm();
  295. }
  296. });
  297. function psubmitForm() {
  298. // initiate variables with form content
  299. var name = $("#pname").val();
  300. var email = $("#pemail").val();
  301. var select = $("#pselect").val();
  302. var terms = $("#pterms").val();
  303. $.ajax({
  304. type: "POST",
  305. url: "php/privacyform-process.php",
  306. data: "name=" + name + "&email=" + email + "&select=" + select + "&terms=" + terms,
  307. success: function(text) {
  308. if (text == "success") {
  309. pformSuccess();
  310. } else {
  311. pformError();
  312. psubmitMSG(false, text);
  313. }
  314. }
  315. });
  316. }
  317. function pformSuccess() {
  318. $("#privacyForm")[0].reset();
  319. psubmitMSG(true, "Request Submitted!");
  320. $("input").removeClass('notEmpty'); // resets the field label after submission
  321. }
  322. function pformError() {
  323. $("#privacyForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
  324. $(this).removeClass();
  325. });
  326. }
  327. function psubmitMSG(valid, msg) {
  328. if (valid) {
  329. var msgClasses = "h3 text-center tada animated";
  330. } else {
  331. var msgClasses = "h3 text-center";
  332. }
  333. $("#pmsgSubmit").removeClass().addClass(msgClasses).text(msg);
  334. }
  335. /* Back To Top Button */
  336. // create the back to top button
  337. $('body').prepend('<a href="body" class="back-to-top page-scroll">Back to Top</a>');
  338. var amountScrolled = 700;
  339. $(window).scroll(function() {
  340. if ($(window).scrollTop() > amountScrolled) {
  341. $('a.back-to-top').fadeIn('500');
  342. } else {
  343. $('a.back-to-top').fadeOut('500');
  344. }
  345. });
  346. /* Removes Long Focus On Buttons */
  347. $(".button, a, button").mouseup(function() {
  348. $(this).blur();
  349. });
  350. })(jQuery);