0

I'm trying to conform to Italian cookie law with a banner that notify cookies left by my website. I used (and changed a little bit) the banner code made available by google (https://www.cookiechoices.org/)

The banner works fine but I added a little function (delete_cookie) in order to let user delete manually cookie, left by the banner, simply clicking on a link in the Cookie Policy page. I made some tests and I can't manage to delete this damn cookie when I click on the link :) (I'm working in local)

    (function(window) {

  if (!!window.cookieChoices) {
    return window.cookieChoices;
  }

  var document = window.document;
  // IE8 does not support textContent, so we should fallback to innerText.
    var supportsTextContent;
  try{
    supportsTextContent = ('textContent');
  } catch(e){
    supportsTextContent = false;
  }

  var cookieChoices = (function() {

    var cookieName = 'displayCookieConsent';
    var cookieConsentId = 'cookieChoiceInfo';
    var dismissLinkId = 'cookieChoiceDismiss';

    function _createHeaderElement(cookieText, dismissText, linkText, linkHref) {
      var butterBarStyles = 'position:fixed; font: bold 1em \'Open Sans\', sans-serif; color: white;width:100%;height: 70px;background-color:#666;' +
          'margin:0; left:0; top:0;padding:10px;z-index:1000;text-align:center;';

      var cookieConsentElement = document.createElement('div');
      cookieConsentElement.id = cookieConsentId;
      cookieConsentElement.style.cssText = butterBarStyles;
      cookieConsentElement.appendChild(_createConsentText(cookieText));

      if (!!linkText && !!linkHref) {
        cookieConsentElement.appendChild(_createInformationLink(linkText, linkHref));
      }
      cookieConsentElement.appendChild(_createDismissLink(dismissText));
      return cookieConsentElement;
    }

    function _createDialogElement(cookieText, dismissText, linkText, linkHref) {
      var glassStyle = 'position:fixed;width:100%;height:100%;z-index:999;' +
          'top:0;left:0;opacity:0.5;filter:alpha(opacity=50);' +
          'background-color:#ccc;';
      var dialogStyle = 'z-index:1000;position:fixed;left:50%;top:50%';
      var contentStyle = 'position:relative;left:-50%;margin-top:-25%;' +
          'background-color:#fff;padding:20px;box-shadow:4px 4px 25px #888;';

      var cookieConsentElement = document.createElement('div');
      cookieConsentElement.id = cookieConsentId;

      var glassPanel = document.createElement('div');
      glassPanel.style.cssText = glassStyle;

      var content = document.createElement('div');
      content.style.cssText = contentStyle;

      var dialog = document.createElement('div');
      dialog.style.cssText = dialogStyle;

      var dismissLink = _createDismissLink(dismissText);
      dismissLink.style.display = 'block';
      dismissLink.style.textAlign = 'right';
      dismissLink.style.marginTop = '8px';


      content.appendChild(_createConsentText(cookieText));
      if (!!linkText && !!linkHref) {
        content.appendChild(_createInformationLink(linkText, linkHref));
      }
      content.appendChild(dismissLink);
      dialog.appendChild(content);
      cookieConsentElement.appendChild(glassPanel);
      cookieConsentElement.appendChild(dialog);
      return cookieConsentElement;
    }

    function _setElementText(element, text) {
      if (supportsTextContent) {
        element.textContent = text;
      } else {
        element.innerText = text;
      }
    }

    function _createConsentText(cookieText) {
      var consentText = document.createElement('span');
      _setElementText(consentText, cookieText);
      return consentText;
    }

    function _createDismissLink(dismissText) {
      var dismissLink = document.createElement('button');
      _setElementText(dismissLink, dismissText);
      dismissLink.id = dismissLinkId;
      dismissLink.style.textDecoration= 'none';
      dismissLink.style.color= '#666';
      dismissLink.href = '#';
      dismissLink.style.marginLeft = '24px';
      return dismissLink;
    }

    function _createInformationLink(linkText, linkHref) {
      var infoLink = document.createElement('a');
      _setElementText(infoLink, linkText);
      infoLink.href = linkHref;
      infoLink.target = '_blank';
      infoLink.style.textDecoration= 'none';
      infoLink.style.color= '#33CC33';
      infoLink.style.marginLeft = '8px';
      return infoLink;
    }

    function _dismissLinkClick() {
      _saveUserPreference();
      _removeCookieConsent();
      return false;
    }

    function _showCookieConsent(cookieText, dismissText, linkText, linkHref, isDialog) {
      if (_shouldDisplayConsent()) {
        _removeCookieConsent();
        var consentElement = (isDialog) ?
            _createDialogElement(cookieText, dismissText, linkText, linkHref) :
            _createHeaderElement(cookieText, dismissText, linkText, linkHref);
        var fragment = document.createDocumentFragment();
        fragment.appendChild(consentElement);
        document.body.appendChild(fragment.cloneNode(true));
        document.getElementById(dismissLinkId).onclick = _dismissLinkClick;
      }
    }

    function showCookieConsentBar(cookieText, dismissText, linkText, linkHref) {
      _showCookieConsent(cookieText, dismissText, linkText, linkHref, false);
    }

    function showCookieConsentDialog(cookieText, dismissText, linkText, linkHref) {
      _showCookieConsent(cookieText, dismissText, linkText, linkHref, true);
    }

    function _removeCookieConsent() {
      var cookieChoiceElement = document.getElementById(cookieConsentId);
      if (cookieChoiceElement != null) {
        cookieChoiceElement.parentNode.removeChild(cookieChoiceElement);
      }
    }

    function _saveUserPreference() {
      // Set the cookie expiry 31 days after today.
      var expiryDate = new Date();
      expiryDate.setDate(expiryDate.getDate() + 31);
      document.cookie = cookieName + '=y; expires=' + expiryDate.toGMTString() +'; Path=/;';
    }

    function _shouldDisplayConsent() {
      // Display the header only if the cookie has not been set.
      return !document.cookie.match(new RegExp(cookieName + '=([^;]+)'));
    }

    var exports = {};
    exports.showCookieConsentBar = showCookieConsentBar;
    exports.showCookieConsentDialog = showCookieConsentDialog;
    return exports;
  })();

  window.cookieChoices = cookieChoices;
  return cookieChoices;
})(this);

function delete_cookie(cookie_name)
{
  var cookie_date = new Date ( );  
  cookie_date.setTime ( cookie_date.getTime() - 1 );
  document.cookie = cookie_name + '=; Path=/; expires=' + cookie_date.toGMTString();
}

HTML code:

<a href="#" onclick="delete_cookie('displayCookieConsent');" class="">clicca qui per cancellarlo</a>
Nuwan
  • 880
  • 1
  • 12
  • 36
seahorse
  • 1
  • 1
  • "Working in local" means what? localhost web server or from harddisk – mplungjan Jul 02 '15 at 07:39
  • in the MDN : https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie#Removing_a_cookie . If it could help – ssbb Jul 02 '15 at 07:41
  • This might be helpful for you, check this out: [javascript - delete cookie][1] [1]: http://stackoverflow.com/q/2144386/5009476 – Vance Jul 02 '15 at 07:44
  • The code seems to works fine... I extracted just you cookie part : http://jsfiddle.net/9589xq90/ It works like a charm... Something else is wrong in your code – ben Jul 02 '15 at 07:49
  • @mplungjan: localhost. – seahorse Jul 02 '15 at 10:57
  • @everyone: thanks for the advaces, I try to see. – seahorse Jul 02 '15 at 11:01
  • Ok, nothing, I tried with the website online and it works fine :) (ieeeee!) I don't know why but in localhost it didn'it work. (sorry for my bad english) – seahorse Jul 02 '15 at 11:06

0 Answers0