Merge pull request #1 from dennisinteractive/async

Merge in async

.gitignore

@@ -45,7 +45,9 @@ intermediate
 publish
 .idea
 node_modules
+bower_components
 
 # build script local files
 build/buildinfo.properties
 build/config/buildinfo.properties
+npm-debug.log

.jshintrc

@@ -17,8 +17,8 @@
   "trailing": true,
   "smarttabs": true,
   "globals": {
-    "module": true,
-    "jQuery": true,
-    "jQQ": true
+    "require": true,
+    "exports": true,
+    "module": true
   }
 }

Gruntfile.js

@@ -5,33 +5,51 @@ module.exports = function(grunt) {
     pkg: grunt.file.readJSON('package.json'),
 
     banner: '/*!\n'+
-            ' * Implied Consent - a jQuery Cookie Notice plugin\n'+
-            ' * self-contained version <%= pkg.version %>\n'+
+            ' * Implied Consent version <%= pkg.version %> - <%= pkg.description %>\n' +
             ' * \n'+
-            ' * Copyright Dennis Publishing\n'+
-            ' * Released under MIT license\n'+
+            ' * Copyright Dennis Publishing\n' +
+            ' * Released under MIT license\n' +
             ' */\n',
 
-    concat: {
-      options: {
-        banner: '<%= banner %>'
-      },
+    browserify: {
       dist: {
-        src: [
-         'src/includes/jquery.quarantine.js',
-         'src/includes/jquery.cookie.js',
-         'src/*.js'],
+        options: {
+          transform: ['browserify-shim'],
+        },
+        src: 'src/<%= pkg.name %>.js',
         dest: 'dist/<%= pkg.name %>.js'
       }
     },
 
+    wrap: {
+      basic: {
+        options: {
+          wrapper: ['(function(f) { f() }(function(){var define,module,exports;return ', '}));'],
+          separator: '',
+        },
+        src: ['dist/<%= pkg.name %>.js'],
+        dest: './'
+      }
+    },
+
+    eol: {
+      dist: {
+        options: {
+          replace: true
+        },
+        files: {
+          src: ['dist/**']
+        }
+      }
+    },
+
     uglify: {
       options: {
         banner: '<%= banner %>'
       },
       dist: {
         files: {
-          'dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
+          'dist/<%= pkg.name %>.min.js': ['<%= browserify.dist.dest %>']
         }
       }
     },
@@ -42,13 +60,13 @@ module.exports = function(grunt) {
       },
       files: [
         'Gruntfile.js',
-        'src/<%= pkg.name %>.js'
+        'src/**.js'
       ]
     },
 
     watch: {
-      files: ['src/**/*.js'],
-      tasks: ['jshint', 'concat', 'uglify', 'bytesize']
+      files: ['<%= jshint.files %>'],
+      tasks: ['default']
     },
 
     bytesize: {
@@ -58,12 +76,23 @@ module.exports = function(grunt) {
     }
   });
 
+  grunt.loadNpmTasks('grunt-browserify');
   grunt.loadNpmTasks('grunt-bytesize');
-  grunt.loadNpmTasks('grunt-contrib-concat');
-  grunt.loadNpmTasks('grunt-contrib-uglify');
   grunt.loadNpmTasks('grunt-contrib-jshint');
+  grunt.loadNpmTasks('grunt-contrib-uglify');
   grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-eol');
+  grunt.loadNpmTasks('grunt-wrap');
 
-  grunt.registerTask('test', ['jshint']);
-  grunt.registerTask('default', ['jshint', 'concat', 'uglify', 'bytesize']);
+  grunt.registerTask('test', [
+    'jshint'
+  ]);
+  grunt.registerTask('default', [
+    'test',
+    'browserify',
+    'wrap',
+    'eol',
+    'uglify',
+    'bytesize'
+  ]);
 };

README.md

@@ -1,33 +1,171 @@
-implied-consent.js
-==================
+# implied-consent.js
 
-An implied consent notice to comply with the UK's implementation of the EU cookie laws (Note: this is not guaranteed to protect you!)
+An implied consent notice to comply with the UK's implementation of the EU
+cookie laws (Note: this is not guaranteed to protect you!)
 
-It should work with a responsively designed site to adapt to mobile devices, or on a fixed-width site it'll stay fixed width.
+## Features
 
-Installation / Usage
-------------
-Upload the minified JS file to your CDN or web host of choice, change the path to your privacy policy, and then stick this in the footer of your site.
+* __Responsive__: it should work with a responsively designed site to adapt to mobile devices, or
+on a fixed-width site it'll stay fixed width
+* __Asynchronous__: from version 1.0.0 onwards the loading and execution of the script is not blocking
+as it is loaded and initialised in an asynchronous fashion.
+* __Lightweight__: The script is self-contained and has no external
+dependencies. It weighs only 5.38 kB when minified and gzipped.
+* __Browser support__: This has been tested on IE8+ and all recent modern browsers.
 
-    <script type="text/javascript" src="//cdn.example.com/path/to/implied-consent.min.js"></script>
+## Installation / Usage
 
-Do not include the script directly from GitHub (http://raw.github.com/...). The file is being served as text/plain and as such being blocked in Internet Explorer on Windows 7 for instance (because of the wrong MIME type). Bottom line: GitHub is not a CDN.
+Upload the minified JS file from the `dist/` folder to your CDN or web host of
+choice, then add the following to the head section of your site.
 
-Add the following code to your page:
+Do not include the script directly from GitHub (http://raw.github.com/...). The
+file is being served as text/plain and as such being blocked in Internet
+Explorer on Windows 7 for instance (because of the wrong MIME type). Bottom
+line: GitHub is not a CDN.
 
+Add the following code to the head of your page:
+
+```js
+<script>
+  var impliedConsent = impliedConsent || {}; impliedConsent.q = impliedConsent.q || [];
+  impliedConsent.q.push(['init']);
+
+  (function(w, d) {
+    var s = d.createElement('script'), el = d.getElementsByTagName('script')[0]; s.async = true;
+    s.src = '//example.com/implied-consent.min.js'; el.parentNode.insertBefore(s, el);
+  })(this, this.document);
+</script>
 ```
+
+If only modern browsers are planned to be supported, load it via an asynchronous script tag:
+
+```js
 <script>
-jQQ.isolate(function($) {
-  $('body').prepend('<div id="__ic-notice"></div>');
-  $('#__ic-notice').impliedConsent();
-});
+  var impliedConsent = impliedConsent || {}; impliedConsent.q = impliedConsent.q || [];
+  impliedConsent.q.push(['init']);
 </script>
+
+<script async src="//example.com/implied-consent.min.js"></script>
 ```
 
+It is possible to define custom configuration options in the `impliedConsent.q.push()` call:
+
+```js
+impliedConsent.q.push(["init", {
+  noticeText: 'We use cookies as set out in our <a href="http://www.example.com/cookie-policy">cookie policy</a>. By using this website, you agree we may place these cookies on your device.',
+  confirmText: "Close",
+  cookieExpiresIn: 3650
+}]);
+```
+
+See configuration options below.
+
+## Configuration options
+
+### options
+
+Type: `Object`
+
+An object of options can be passed as a second argument. The default values are
+as follows.
+
+### options.noticeText
+
+Type: `String` Default value: `We use cookies as set out in our privacy policy. By using this website, you agree we may place these cookies on your device.`
+
+Text content to display as the notice. Please note that the string defined here will be inserted using `Element.innerHTML()` so it may contain HTML tags.
+
+### options.confirmText
+
+Type: `String` Default value: `Close`
+
+Text value of the close button.
+
+### options.validateByClick
+
+Type: `Boolean` Default value: `true`
+
+If set to `true` extra event listeners are launched on `a`, `button` and
+`input[type="submit"]` tags. The callback for these listeners sets the cookie as
+if the Close button was clicked. `a` tags only trigger this if their href
+attributes start with `#`, `/` or the current host name of the site.
+
+### options.cookieExpiresIn
+
+Type: `Integer` Default value: `365`
+
+Cookie expiry value in days.
+
+### options.backgroundColor
+
+Type: `String` Default value: `#222`
+
+CSS background-color value of the notice container element.
+
+### options.textColor
 
-License
--------
-### Copyright 2013 Dennis Publishing
+Type: `String` Default value: `#eee`
+
+CSS color value for any container text.
+
+### options.textColor
+
+Type: `String` Default value: `#eee`
+
+CSS color value for any container text.
+
+### options.linkColor
+
+Type: `String` Default value: `#acf`
+
+CSS color value for link text in container.
+
+### options.buttonBackgroundColor
+
+Type: `String` Default value: `#222`
+
+CSS background-color value of the notice button.
+
+### options.buttonColor
+
+Type: `String` Default value: `#fff`
+
+CSS color value of the button.
+
+### options.fontSize
+
+Type: `String` Default value: `12px`
+
+CSS font-size value for text in the container.
+
+### options.fontFamily
+
+Type: `String` Default value: `sans-serif`
+
+CSS font-family value for text in the container.
+
+## Building from source
+
+Development is based on `npm`, `bower` and `grunt` so make sure you have these
+installed globally. Then install project dependencies:
+
+`npm install && bower install`
+
+Then run the build via
+
+`grunt`
+
+The build output files are located in the `dist/` folder.
+
+## Authors
+
+* Attila Beregszaszi
+* Will Howlett
+* Paul Lomax
+
+## License
+
+### Copyright 2015 Dennis Publishing
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the
@@ -47,4 +185,3 @@ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
 LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
 OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
 WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-

bower.json

@@ -0,0 +1,21 @@
+{
+  "name": "implied-consent",
+  "version": "0.3.0",
+  "private": true,
+  "homepage": "https://github.com/dennisinteractive/implied-consent",
+  "authors": [
+    "Attila Beregszaszi <[email protected]>"
+  ],
+  "license": "MIT",
+  "private": true,
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "dependencies": {
+    "eventlistener-polyfill": "~1.0.0"
+  }
+}