https://www.cop.es/ihavecookies/jquery.ihavecookies.js

1/*!
2 * ihavecookies - jQuery plugin for displaying cookie/privacy message
3 * v0.3.2
4 *
5 * Copyright (c) 2018 Ketan Mistry (https://iamketan.com.au)
6 * Licensed under the MIT license:
7 * http://www.opensource.org/licenses/mit-license.php
8 *
9 */
10(function($) {
11
12    /*
13    |--------------------------------------------------------------------------
14    | Cookie Message
15    |--------------------------------------------------------------------------
16    |
17    | Displays the cookie message on first visit or 30 days after their
18    | last visit.
19    |
20    | @param event - 'reinit' to reopen the cookie message
21    |
22    */
23    $.fn.ihavecookies = function(options, event) {
24
25        var $element = $(this);
26
27        // Set defaults
28        var settings = $.extend({
29            cookieTypes: [
30               
31            ],
32            title: 'Cookies y Política de Privacidad',
33            message: 'Este sitio web solamente utiliza cookies esenciales y el sitio no funcionará como se espera sin ellas. ',
34            link: '/privacy-policy',
35            delay: 2000,
36            expires: 30,
37            moreInfoLabel: 'More information',
38            acceptBtnLabel: 'Accept Cookies',
39            advancedBtnLabel: 'Customise Cookies',
40            cookieTypesTitle: 'Select cookies to accept',
41            fixedCookieTypeLabel:'Necessary',
42            fixedCookieTypeDesc: 'These are cookies that are essential for the website to work correctly.',
43            onAccept: function(){},
44            uncheckBoxes: false
45        }, options);
46
47        var myCookie = getCookie('cookieControl');
48        var myCookiePrefs = getCookie('cookieControlPrefs');
49        if (!myCookie || !myCookiePrefs || event == 'reinit') {
50            // Remove all instances of the cookie message so it's not duplicated
51            $('#gdpr-cookie-message').remove();
52
53            // Set the 'necessary' cookie type checkbox which can not be unchecked
54            var cookieTypes = '<li><input type="checkbox" name="gdpr[]" value="necessary" checked="checked" disabled="disabled"> <label title="' + settings.fixedCookieTypeDesc + '">' + settings.fixedCookieTypeLabel + '</label></li>';
55
56            // Generate list of cookie type checkboxes
57            preferences = JSON.parse(myCookiePrefs);
58            $.each(settings.cookieTypes, function(index, field) {
59                if (field.type !== '' && field.value !== '') {
60                    var cookieTypeDescription = '';
61                    if (field.description !== false) {
62                        cookieTypeDescription = ' title="' + field.description + '"';
63                    }
64                    cookieTypes += '<li><input type="checkbox" id="gdpr-cookietype-' + field.value + '" name="gdpr[]" value="' + field.value + '" data-auto="on"> <label for="gdpr-cookietype-' + field.value + '"' + cookieTypeDescription + '>' + field.type + '</label></li>';
65                }
66            });
67
68            // Display cookie message on page
69            var cookieMessage = '<div id="gdpr-cookie-message"><h4>' + settings.title + '</h4><p>' + settings.message + ' <a href="' + settings.link + '">' + settings.moreInfoLabel + '</a><div id="gdpr-cookie-types" style="display:none;"><h5>' + settings.cookieTypesTitle + '</h5><ul>' + cookieTypes + '</ul></div><p><button id="gdpr-cookie-accept" type="button">' + settings.acceptBtnLabel + '</button><button id="gdpr-cookie-advanced" type="button">' + settings.advancedBtnLabel + '</button></p></div>';
70            setTimeout(function(){
71                $($element).append(cookieMessage);
72                $('#gdpr-cookie-message').hide().fadeIn('slow', function(){
73                    // If reinit'ing, open the advanced section of message
74                    // and re-check all previously selected options.
75                    if (event == 'reinit') {
76                        $('#gdpr-cookie-advanced').trigger('click');
77                        $.each(preferences, function(index, field) {
78                            $('input#gdpr-cookietype-' + field).prop('checked', true);
79                        });
80                    }
81                });
82            }, settings.delay);
83
84            // When accept button is clicked drop cookie
85            $('body').on('click','#gdpr-cookie-accept', function(){
86                // Set cookie
87                dropCookie(true, settings.expires);
88
89                // If 'data-auto' is set to ON, tick all checkboxes because
90                // the user hasn't clicked the customise cookies button
91                $('input[name="gdpr[]"][data-auto="on"]').prop('checked', true);
92
93                // Save users cookie preferences (in a cookie!)
94                var prefs = [];
95                $.each($('input[name="gdpr[]"]').serializeArray(), function(i, field){
96                    prefs.push(field.value);
97                });

98                setCookie('cookieControlPrefs', encodeURIComponent(JSON.stringify(prefs)), 365);
99
100                // Run callback function
101                settings.onAccept.call(this);
102            });
103
104            // Toggle advanced cookie options
105            $('body').on('click', '#gdpr-cookie-advanced', function(){
106                // Uncheck all checkboxes except for the disabled 'necessary'
107                // one and set 'data-auto' to OFF for all. The user can now
108                // select the cookies they want to accept.
109                $('input[name="gdpr[]"]:not(:disabled)').attr('data-auto', 'off').prop('checked', false);
110                $('#gdpr-cookie-types').slideDown('fast', function(){
111                    $('#gdpr-cookie-advanced').prop('disabled', true);
112                });
113            });
114
115        } else {
116            var cookieVal = true;
117            if (myCookie == 'false') {
118                cookieVal = false;
119            }
120            dropCookie(cookieVal, settings.expires);
121        }
122
123        // Uncheck any checkboxes on page load
124        if (settings.uncheckBoxes === true) {
125            $('input[type="checkbox"].ihavecookies').prop('checked', false);
126        }
127
128    };
129
130    // Method to get cookie value
131    $.fn.ihavecookies.cookie = function() {
132        var preferences = getCookie('cookieControlPrefs');
133        return JSON.parse(preferences);
134    };
135
136    // Method to check if user cookie preference exists
137    $.fn.ihavecookies.preference = function(cookieTypeValue) {
138        var control = getCookie('cookieControl');
139        var preferences = getCookie('cookieControlPrefs');
140        preferences = JSON.parse(preferences);
141        if (control === false) {
142            return false;
143        }
144        if (preferences === false || preferences.indexOf(cookieTypeValue) === -1) {
145            return false;
146        }
147        return true;
148    };
149
150    /*
151    |--------------------------------------------------------------------------
152    | Drop Cookie
153    |--------------------------------------------------------------------------
154    |
155    | Function to drop the cookie with a boolean value of true.
156    |
157    */
158    var dropCookie = function(value, expiryDays) {
159        setCookie('cookieControl', value, expiryDays);
160        $('#gdpr-cookie-message').fadeOut('fast', function() {
161            $(this).remove();
162        });
163    };
164
165    /*
166    |--------------------------------------------------------------------------
167    | Set Cookie
168    |--------------------------------------------------------------------------
169    |
170    | Sets cookie with 'name' and value of 'value' for 'expiry_days'.
171    |
172    */
173    var setCookie = function(name, value, expiry_days) {
174        var d = new Date();
175        d.setTime(d.getTime() + (expiry_days*24*60*60*1000));
176        var expires = "expires=" + d.toUTCString();
177        document.cookie = name + "=" + value + ";" + expires + ";path=/";
178        return getCookie(name);
179    };
180
181    /*
182    |--------------------------------------------------------------------------
183    | Get Cookie
184    |--------------------------------------------------------------------------
185    |
186    | Gets cookie called 'name'.
187    |
188    */
189    var getCookie = function(name) {
190        var cookie_name = name + "=";
191        var decodedCookie = decodeURIComponent(document.cookie);
192        var ca = decodedCookie.split(';');
193        for (var i = 0; i < ca.length; i++) {
194            var c = ca[i];
195            while (c.charAt(0) == ' ') {
196                c = c.substring(1);
197            }
198            if (c.indexOf(cookie_name) === 0) {
199                return c.substring(cookie_name.length, c.length);
200            }
201        }
202        return false;
203    };
204
205}(jQuery));