https://codebeamstockholm.com/assets/js/main.js

1/**
2 *
3 *  Main JavaScript
4 *
5 *  @package gleesik_scripts
6 *
7 **/
8
9// IIFE - Immediately Invoked Function Expression
10;(function ($, window, document) {
11  // The $ is now locally scoped
12
13  // Listen for the jQuery ready event on the document
14  $(function () {
15    // The DOM is ready!
16
17    // Global Variables
18    var $window = $(window)
19
20    /**
21     *  Page Loader
22     **/
23    setTimeout(function () {
24      $('.page-loader').addClass('load-complete')
25    }, 1500)
26
27    /**
28     *  Parallax with Scrollax.js - Initialization
29     **/
30    ;('use strict')
31    $.Scrollax()
32
33    /**
34     *  Main Menu Navigation
35     **/
36    var $body = $('body')
37    var $nav_menu = $('.navigation-bar')
38    var $nav_menu_link = $('#navMenu ul li a')
39    var $toggle_menu_button = $('.navTrigger')
40
41    // Navigation Menu Link
42    $nav_menu_link.on('click', function () {
43      // Select Current Navigation Item
44      $nav_menu_link.parent().removeClass('current-menu-item')
45      $(this).parent().addClass('current-menu-item')
46
47      // Close Mobile Menu
48      $nav_menu.removeClass('active')
49      $toggle_menu_button.removeClass('active')
50      $body.removeClass('no-scroll')
51    })
52
53    // Toggle Mobile Menu
54    $toggle_menu_button.on('click', function () {
55      $nav_menu.toggleClass('active')
56      $body.toggleClass('no-scroll')
57      $(this).toggleClass('active')
58    })
59
60    // Remove all classes on window resize
61    $window.on('resize', function () {
62      $nav_menu.removeClass('active')
63      $body.removeClass('no-scroll')
64      $toggle_menu_button.removeClass('active')
65    })
66
67    /**
68     *  Portfolio
69     **/
70    var $filter_menu_item = $('.filter-menu ul li')
71    var $portfolio_grid = $('.portfolio-grid')
72    var $portfolio_grid_item = $portfolio_grid.children('.item')

73    var $overlay = $portfolio_grid.children('#overlay')
74    var $img = '<img alt="Portfolio Overlay Image" />'
75    var $data_filters = null
76
77    // Filter Menu
78    $filter_menu_item.on('click', function () {
79      // Filter Menu
80      $filter_menu_item.removeClass('current')
81      $(this).addClass('current')
82
83      // Collecting Data Filters
84      $data_filters = $(this).data('filter')
85
86      // Hide All Portfolio Items
87      if ($data_filters == 'all') {
88        $portfolio_grid_item.addClass('visible')
89      } else {
90        // Show Portfolio Items from filter
91        $portfolio_grid_item.removeClass('visible')
92        $($data_filters).addClass('visible')
93      }
94    })
95
96    // Show Image - Lightbox
97    $portfolio_grid_item.find('.item-expand').on('click', function (e) {
98      // Prevent Default Link Event
99      e.preventDefault()
100
101      // Get Image Link
102      var $src = $(this).attr('href')
103
104      // Create Image on the DOM
105      $overlay.append($img)
106
107      // Show Overlay Image
108      $overlay.fadeIn(200).children('img').attr('src', $src)
109
110      // Lock Body Scroll
111      $body.toggleClass('no-scroll')
112    })
113
114    // Hide Overlay Lightbox
115    $overlay.on('click', function () {
116      // Hide Overlay Image
117      $(this).fadeOut(200)
118
119      // Remove Image from DOM
120      $overlay.children('img').remove()
121
122      // Unlock Body Scroll
123      $body.toggleClass('no-scroll')
124    })
125
126    /**
127     *  Testimonials Carousel Setup
128     **/
129    $('#testimonials-carousel').owlCarousel({
130      navigation: true, // Show next & prev buttons
131      slideSpeed: 300,
132      paginationSpeed: 400,
133      singleItem: true,
134    })
135
136    $('#testimonials-carousel-quotes').owlCarousel({
137      loop: true,
138      autoplay: true,
139      margin: 40,
140      responsive: {
141        0: {
142          items: 1,
143          nav: true,
144          dots: false,
145          margin: 0,
146        },
147        640: {
148          items: 2,
149          dots: true,
150          nav: false,
151        },
152        1024: {
153          items: 3,
154          dots: true,
155          nav: false,
156        },
157      },
158    })
159    /**
160     *  Smooth Scrolling for Links
161     **/
162    $('a[href*="#"]:not([href="#"])').on('click', function () {
163      if (
164        location.pathname.replace(/^\//, '') ==
165          this.pathname.replace(/^\//, '') &&
166        location.hostname == this.hostname
167      ) {
168        var target = $(this.hash)
169        target = target.length ? target : $('[name=' + this.hash.slice(1) + ']')
170        if (target.length) {
171          $('html, body').animate(
172            {
173              scrollTop: target.offset().top,
174            },
175            1000
176          )
177          return false
178        }
179      }
180    })
181  })
182})(window.jQuery, window, document)
183// The global jQuery object is passed as a parameter