polymer-cookie.html

<!--
 Copyright (c) 2015 Andrea SonnY. All rights reserved.
 This code may only be used under the MIT license found at https://github.com/andreasonny83/polymer-cookie/blob/master/LICENSE
-->

<link rel="import" href="../polymer/polymer.html">

<!--
The `polymer-cookie` element stores cookies using a web component
The best practice to use cookie in a Polymer project

  <polymer-cookie
    id="test_cookie"
    name="test_cookie"
    value="hello world!"
    time=14
    format="d">
  </polymer-cookie>

This will prepare a cookie named test_cookie that will expires after 2 weeks

Note: The `params` attribute must be double quoted JSON.

The following is a simple example for testing your 'test_cookie' in your project:

  var cookie = Polymer.dom(document).querySelector('#test_cookie');

  cookie.createCookie();

  console.log( cookie.readCookie() );

  cookie.eraseCookie();


@element polymer-cookie
@homepage https://github.com/andreasonny83/polymer-cookie
-->

<dom-module id="polymer-cookie">
  <script>
    Polymer({
      is: 'polymer-cookie',

      properties: {
        /**
         * The cookie name
         *
         * @type {String}
         */
        name: {
          type: String,
          value: 'polymer-cookie',
          reflectToAttribute: true
        },

        /**
         * The cookie value
         */
        value: {
          type: String,
          value: '',
          reflectToAttribute: true
        },

        /**
         * The cookie domain
         *
         * @type {String}
         */
        domain: {
          type: String,
          value: '',
          reflectToAttribute: true
        },

        /**
         * The cookie path
         *
         * @type {String}
         */
        path: {
          type: String,
          value: '',
          reflectToAttribute: true
        },

        /**
         * The expiration time
         *
         * @type {Number}
         *       Default: 1
         *        0 : Expiration time is set in the past
         *        -1: Never expires
         */
        time: {
          type: Number,
          value: 1,
          reflectToAttribute: true
        },

        /**
         * Contains the expiration format
         *
         * @type {String} optional
         *       Default :'d'
         *       's' : seconds
         *       'm' : minutes
         *       'h' : hours
         *       'd' : days
         */
        format: {
          type: String,
          value: 'd',
          reflectToAttribute: true
        },

        /**
         * Using the Secure option you can tell the browser (or other http clients)
         * to only send the cookie over SSL connections
         *
         * @type {Boolean}
         */
        secure: {
          type: Boolean,
          value: false,
          reflectToAttribute: true
        },

        /**
         * HttpOnly
         *
         * @type {Boolean}
         */
        httpOnly: {
          type: Boolean,
          value: false,
          reflectToAttribute: true
        },

        /**
         * Create the cookie automatically as the element is rendered on the DOM
         *
         * @type {Boolean}
         */
        autoSet: {
          type: Boolean,
          value: false,
          reflectToAttribute: true
        }
      },

      /**
       * _setCookie
       * private method that returns a valid cookie string
       *
       * @param  {String} expires   the cookie expiration time in UTC format
       *
       * @return {String}           The formatted cookie ready to be
       *                            sent into the document
       */
      _setCookie: function(expires) {
        return [
          this.name, '=', this.value,
          ';expires=' + expires,
          this.path && ';path=' + this.path,
          this.domain && ";domain=" + this.domain,
          this.secure ? ';secure' : '',
          this.httpOnly ? ';HttpOnly' : '',
          ';'
        ].join('');
      },

      ready: function() {
        if (!!this.autoSet) {
          this.createCookie();
        }
      },

      /**
       * Create a cookie
       */
      createCookie: function() {
        var FOREVER = 'Fri, 31 Dec 9999 23:59:59 GMT';
        var date = new Date();
        var expires;

        switch(this.format) {
          case 'd':
            date.setTime(date.getTime() +
            this.time * 1000 * 24 * 60 * 60);
            break;
          case 'h':
            date.setTime(date.getTime() +
            this.time * 1000 * 60 * 60);
            break;
          case 'm':
            date.setTime(date.getTime() +
            this.time * 1000 * 60);
            break;
          default:
            date.setTime(date.getTime() +
            this.time * 1000);
            break;
        }

        expires = this.time === -1 ? FOREVER : date.toUTCString();

        document.cookie = this._setCookie(expires);
      },

      /**
       * Read the cookie value
       * @return {String} Return the cookie value in a string format
       */
      readCookie: function() {
        var reg = new RegExp('(?:(?:^|.*;\\s*)' +
                  this.name +
                  '\\s*\\=\\s*([^;]*).*$)|^.*$');

        return document.cookie.replace(reg, '$1');
      },

      /**
       * Erase the cookie information
       */
      eraseCookie: function() {
        var output = this.name +
            '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;path=/;';

        if (this.domain) {
          output += "domain=" + this.domain;
        }

        document.cookie = output;
      }
    });
  </script>
</dom-module>