web/js/partials/app.js   F
last analyzed

Complexity

Total Complexity 60
Complexity/F 2.31

Size

Lines of Code 357
Function Count 26

Duplication

Duplicated Lines 0
Ratio 0 %

Importance

Changes 1
Bugs 0 Features 0
Metric Value
cc 0
eloc 209
nc 256
dl 0
loc 357
rs 3.6
c 1
b 0
f 0
wmc 60
mnd 3
bc 63
fnc 26
bpm 2.423
cpm 2.3076
noi 5

How to fix   Complexity   

Complexity

Complex classes like web/js/partials/app.js often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.

Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.

1
$(document).ready(function () {
2
    /**
3
     * Show password
4
     */
5
    $('.icon-password--js').on('click', function () {
6
        var input = $(this).siblings('input'),
7
            type = input.attr('type');
8
9
        $(this).toggleClass("input-password__icon--active");
10
11
        if (type === "password") {
12
            input.attr("type", "text");
13
        } else {
14
            input.attr("type", "password");
15
        }
16
    });
17
18
    /**
19
     * Mask phone input
20
     */
21
    // $('.mask-phone-input--js').mask("+38 099 999 99 99",
22
    //     {
23
    //         placeholder: " ",
24
    //         autoclear: false
25
    //     });
26
27
    /**
28
     * Payment popup
29
     */
30
    $('#add-user-trigger').on('click', function (e) {
31
        e.preventDefault();
32
        $(this).hide();
33
        $("#payment_user_name").prop('required', true);
34
        $("#payment_user_surname").prop('required', true);
35
        $("#payment_user_email").prop('required', true);
36
37
        $('#payment-add-user').show();
38
    });
39
40
    $('#cancel-add-user').on('click', function (e) {
41
        e.preventDefault();
42
        $("#payment_user_name").prop('required', false);
43
        $("#payment_user_surname").prop('required', false);
44
        $("#payment_user_email").prop('required', false);
45
        $("input[name='user-name']").val('').removeClass('input--error').next('p.text-error').remove();
46
        $("input[name='user-surname']").val('').removeClass('input--error').next('p.text-error').remove();
47
        $("input[name='user-email']").val('').removeClass('input--error').next('p.text-error').remove();
48
        $('#payment-add-user').hide();
49
        $('#add-user-trigger').show();
50
    });
51
52
    $('#promo-code-trigger').on('click', function (e) {
53
        e.preventDefault();
54
        $(this).hide();
55
        $("#user_promo_code").prop('required', true);
56
        $('#add-promo-code').show();
57
    });
58
59
    $('#cancel-promo-code').on('click', function (e) {
60
        e.preventDefault();
61
        $('#add-promo-code').hide();
62
        $("input[name='user_promo_code']").val('').removeClass('input--error').next('p.text-error').remove();
63
        $("#user_promo_code").prop('required', false);
64
        $('#promo-code-trigger').show();
65
    });
66
67
    /**
68
     * Program navigation for mobile devices
69
     */
70
    $(window).bind('resize load', function () {
71
        if ($(window).width() < 768) {
72
            $('.program-header__td').on('click', function () {
73
                var currentIndex = $(this).index() + 2,
74
                    eventRow = $('.program-body__tr--event');
75
76
                $(this).addClass('program-header__td--active')
77
                    .siblings()
78
                    .removeClass('program-header__td--active');
79
                eventRow.find('.program-body__td').not('.program-body__td:nth-child(1)').hide();
80
                eventRow.find('.program-body__td:nth-child(' + currentIndex + ')').show();
81
            });
82
        }
83
    });
84
85
    /**
86
     * Dropdown for referral link
87
     */
88
    $('#ref-dropdown').on('change', function () {
89
        var value = $('option:selected', this).text(),
90
            ref = $('option:selected', this).data('ref');
91
92
        $('#ref-selected').text(value);
93
        $('#ref-input').val(ref);
94
    });
95
96
    /**
97
     * Referral link copy yo clipboard
98
     */
99
    var isiOs = navigator.userAgent.match(/ipad|ipod|iphone/i);
0 ignored issues
show
Bug introduced by
The variable navigator seems to be never declared. If this is a global, consider adding a /** global: navigator */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
100
    
101
    $('#ref-copy').on('click', function () {
102
        var input = $('#ref-input');
103
104
        if (isiOs) {
105
            var el = input.get(0),
106
                editable = el.contentEditable,
107
                readOnly = el.readOnly;
108
            el.contentEditable = true;
109
            el.readOnly = false;
110
111
            var range = document.createRange();
112
            range.selectNodeContents(el);
113
114
            var sel = window.getSelection();
115
            sel.removeAllRanges();
116
            sel.addRange(range);
117
            el.setSelectionRange(0, 999999);
118
            el.contentEditable = editable;
119
            el.readOnly = readOnly;
120
        } else {
121
            input.select();
122
        }
123
124
        var clipBoard = document.execCommand('copy');
125
        if (clipBoard) {
126
            $(this).addClass('tooltip-copy--active');
127
        }
128
129
        var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
0 ignored issues
show
Bug introduced by
The variable navigator seems to be never declared. If this is a global, consider adding a /** global: navigator */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
130
        if (isMobile) {
131
            input.blur();
132
133
            if ($(this).hasClass('tooltip-copy--active')) {
134
                setTimeout(function () {
135
                    $('.tooltip-copy').removeClass('tooltip-copy--active');
136
                }, 2000);
137
            }
138
        }
139
    });
140
141
    $('.tooltip-copy').on('mouseout', function () {
142
        if ($(this).hasClass('tooltip-copy--active')) {
143
            setTimeout(function () {
144
                $('.tooltip-copy').removeClass('tooltip-copy--active');
145
            }, 1000);
146
        }
147
    });
148
149
    /**
150
     * Show the terms of the program for mobile devices
151
     */
152
    $('.share-banner__hint-show').on('click', function () {
153
        $(this).hide();
154
        $('.share-banner__hint').show();
155
    });
156
157
    /**
158
     * Fixed event header on scroll
159
     */
160
    if ($('.event-header').length) {
161
        var eventHeader = $('.event-header'),
162
            eventHeaderFixed = $('.fix-event-header');
163
164
        $(document).bind('scroll load', function () {
165
            var eventHeaderHeight = eventHeader.outerHeight(),
166
                offsetTopEvent = eventHeader.offset().top;
167
168
            if ($(this).scrollTop() > eventHeaderHeight + offsetTopEvent) {
169
                eventHeaderFixed.addClass('fix-event-header--show');
170
            } else {
171
                eventHeaderFixed.removeClass('fix-event-header--show');
172
            }
173
        });
174
    }
175
176
    /**
177
     * Fixed event static header on scroll for review-page, venue-page
178
     */
179
    var eventHeaderFixedStat = $('.fix-event-header--static'),
180
        sectionAfterEventHeader = $('.section-after-event-header');
181
182
    $(document).bind('scroll load', function () {
183
        var headerHeight = $('.header').outerHeight();
184
185
        if ($(this).scrollTop() >= headerHeight) {
186
            sectionAfterEventHeader.addClass('section-after-event-header--mr-t');
187
            eventHeaderFixedStat.addClass('fix-event-header--fixed');
188
        } else {
189
            sectionAfterEventHeader.removeClass('section-after-event-header--mr-t');
190
            eventHeaderFixedStat.removeClass('fix-event-header--fixed');
191
        }
192
    });
193
194
    /**
195
     * Fixed program header on scroll
196
     */
197
    if ($('.program').length) {
198
        var program = $('.program'),
199
            programBody = $('.program-body'),
200
            programHeader = $('.program-header'),
201
            offsetTopNegative;
202
203
        if ($(window).width() >= 768) {
204
            offsetTopNegative = 28;
205
        } else {
206
            offsetTopNegative = 0;
207
        }
208
209
        $(document).bind('scroll load', function () {
210
            var programHeight = program.outerHeight(),
211
                programHeaderHeight = programHeader.outerHeight(),
212
                headerFixedHeight = $('.fix-event-header').outerHeight(),
213
                offsetTopProgram = program.offset().top - headerFixedHeight;
214
215
            if ($(this).scrollTop() > offsetTopProgram + offsetTopNegative && $(this).scrollTop() < offsetTopProgram + offsetTopNegative + programHeight - programHeaderHeight) {
216
                programHeader.addClass('program-header--fixed');
217
                programBody.addClass('program-body--header-fixed');
218
                programHeader.removeClass('program-header--absolute');
219
            } else if ($(this).scrollTop() > offsetTopProgram + programHeight - programHeaderHeight) {
220
                programHeader.addClass('program-header--absolute');
221
                programHeader.removeClass('program-header--fixed');
222
            } else {
223
                programHeader.removeClass('program-header--fixed');
224
                programHeader.removeClass('program-header--absolute');
225
                programBody.removeClass('program-body--header-fixed');
226
            }
227
        });
228
    }
229
230
    /**
231
     * Show event menu for mobile devices
232
     */
233
    var eventMenuTrigger = $('#event-menu-trigger'),
234
        eventMenu = $('.event-menu');
235
236
    eventMenuTrigger.on('click', function () {
237
        $(this).toggleClass('open');
238
        $('body').toggleClass('overlay');
239
        eventMenu.toggleClass('event-menu--open');
240
    });
241
242
    if (eventMenuTrigger.length) {
243
        $(document).bind('click touchstart', function (e) {
244
            var el = $(e.target);
245
246
            if (el.closest('#event-menu-trigger').length || el.closest('.event-menu').length) {
247
                return true;
248
            } else {
0 ignored issues
show
Comprehensibility introduced by
else is not necessary here since all if branches return, consider removing it to reduce nesting and make code more readable.
Loading history...
249
                closeMenu();
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
250
            }
251
        });
252
    }
253
254
    /**
255
     * Go to block
256
     */
257
    var goToBlock = $(".go-to-block");
258
259
    goToBlock.click(function (e) {
260
        e.preventDefault();
261
        animateScroll($(this).attr('href'));
262
263
        if (eventMenu.length) {
264
            closeMenu();
265
        }
266
    });
267
268
    /**
269
     * Anchor from another page
270
     */
271
    $(window).bind("load", function () {
272
        if (window.location.hash) {
273
            setTimeout(function () {
274
                animateScroll(window.location.hash);
275
            }, 0);
276
        }
277
    });
278
279
    function animateScroll(target) {
280
        var fixHeader = $('.fix-event-header'),
281
            sumOffset;
282
283
        if (fixHeader.length) {
284
            sumOffset = $('.fix-event-header').outerHeight() + 24;
285
        } else {
286
            sumOffset = 0;
287
        }
288
        if ($(target).length) {
289
            $('html, body').animate({
290
                scrollTop: ($(target).offset().top - sumOffset)
291
            }, 500);
292
        }
293
    }
294
295
    function closeMenu() {
296
        $('body').removeClass('overlay');
297
        eventMenuTrigger.removeClass('open');
298
        eventMenu.removeClass('event-menu--open');
299
    }
300
301
    /**
302
     *  Button for scroll top page
303
     */
304
    if ($('.btn-up').length && $(window).width() > 1024) {
305
        $(window).scroll(function () {
306
            var headerHeight = $('.header').outerHeight(),
307
                eventHeaderHeight = $('.event-header').outerHeight(),
308
                windowHeight = $(window).outerHeight(),
309
                footerOffsetTop = $('.footer').offset().top,
310
                scrollHeight = $(this).scrollTop(),
311
                mapOffsetTop = $('.location__map').length ? $('.location__map').offset().top : 0,
312
                mapMrTop = parseInt($('.location__map').length ? $('.location__map').css('margin-top') : 0),
313
                footerMrTop = parseInt($('.footer').css('margin-top')),
314
                sumHeight = scrollHeight + windowHeight;
315
316
            if (scrollHeight > headerHeight + eventHeaderHeight) {
317
                $('.btn-up').addClass('btn-up--visible');
318
            } else {
319
                $('.btn-up').removeClass('btn-up--visible');
320
            }
321
322
            if ($('.location__map').length && sumHeight - 87 > mapOffsetTop - mapMrTop) {
323
                $('.btn-up').css('bottom', sumHeight - (mapOffsetTop - mapMrTop));
324
            }
325
            else if (sumHeight - 87 > footerOffsetTop - footerMrTop) {
326
                $('.btn-up').css('bottom', sumHeight - (footerOffsetTop - footerMrTop));
327
            }
328
            else {
329
                $('.btn-up').css('bottom', 87);
330
            }
331
332
        });
333
334
        $('.btn-up').on('click', function () {
335
            $('body,html').animate({
336
                scrollTop: 0
337
            }, 600);
338
            return false;
339
        });
340
    }
341
342
    if (window.location.hash && window.location.hash === '#_=_') {
343
        if (window.history && history.pushState) {
0 ignored issues
show
Bug introduced by
The variable history seems to be never declared. If this is a global, consider adding a /** global: history */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
344
            window.history.pushState("", document.title, window.location.pathname);
345
        } else {
346
            // Prevent scrolling by storing the page's current scroll offset
347
            var scroll = {
348
                top: document.body.scrollTop,
349
                left: document.body.scrollLeft
350
            };
351
            window.location.hash = '';
352
            // Restore the scroll offset, should be flicker free
353
            document.body.scrollTop = scroll.top;
354
            document.body.scrollLeft = scroll.left;
355
        }
356
    }
357
});