feat: Add storage-type (#47)

Sometime there is a need to specify storage (localStorage or Cookies), like in situations, when you use Nuxt.js and there is a need to read 'cookies:accept' in `nuxtServerInit` hook. So, you can't work with **localStorage** and with **SSR**. Thats why it will be great to choose where to store.

I've added prop called `storageType`. It can be 'localStorage' (default) or 'cookies'.

README.md

@@ -73,7 +73,8 @@ For a more complex layout use the scoped slot
 | message | 'This website uses cookies to ensure you get the best experience on our website.' | String | Your message in the content area
 | theme | 'base' | String | Selected theme. You can also create a custom one
 | position | 'bottom' | String | Possible positions are `bottom` or `top`
-| transitionName | 'slideFromBottom' | String | Enter and leave transitions. Currenty supported `slideFromBottom`, `slideFromTop`, `fade`
+| transitionName | 'slideFromBottom' | String | Enter and leave transitions. Currently supported `slideFromBottom`, `slideFromTop`, `fade`
+| storageType | 'localStorage' | String | Type of storage, where to store 'cookies:accept': true. Can be `localStorage` (default) or `cookies`. If LocalStorage is unsupported, then used Cookies.
 
 ## Events
 

src/components/CookieLaw.vue

@@ -17,6 +17,12 @@
 
 <script>
   import * as Cookie from 'tiny-cookie'
+
+  const STORAGE_TYPES = {
+    local: 'localStorage',
+    cookies: 'cookies'
+  }
+
   export default {
     name: 'VueCookieLaw',
     props: {
@@ -71,6 +77,10 @@
       storageName: {
         type: String,
         default: 'cookie:accepted'
+      },
+      storageType: {
+        type: String,
+        default: STORAGE_TYPES.local
       }
     },
     data () {
@@ -94,18 +104,23 @@
       },
       target () {
         return this.buttonLinkNewTab ? '_blank' : '_self'
+      },
+      canUseLocalStorage () {
+        return this.storageType === STORAGE_TYPES.local && this.supportsLocalStorage
       }
     },
     created () {
-      // Check for availability of localStorage
-      try {
-        const test = '__vue-cookielaw-check-localStorage'
+      if (this.storageType === STORAGE_TYPES.local) {
+        // Check for availability of localStorage
+        try {
+          const test = '__vue-cookielaw-check-localStorage'
 
-        window.localStorage.setItem(test, test)
-        window.localStorage.removeItem(test)
-      } catch (e) {
-        console.info('Local storage is not supported, falling back to cookie use')
-        this.supportsLocalStorage = false
+          window.localStorage.setItem(test, test)
+          window.localStorage.removeItem(test)
+        } catch (e) {
+          console.info('Local storage is not supported, falling back to cookie use')
+          this.supportsLocalStorage = false
+        }
       }
 
       if (!this.getVisited() === true) {
@@ -114,14 +129,14 @@
     },
     methods: {
       setVisited () {
-        if (this.supportsLocalStorage) {
+        if (this.canUseLocalStorage) {
           localStorage.setItem(this.storageName, true)
         } else {
           Cookie.set(this.storageName, true)
         }
       },
       getVisited () {
-        if (this.supportsLocalStorage) {
+        if (this.canUseLocalStorage) {
           return localStorage.getItem(this.storageName)
         } else {
           return Cookie.get(this.storageName)