diff --git a/.eslintrc.js b/.eslintrc.js index 1b89b09..6ce976d 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -28,6 +28,7 @@ module.exports = { "no-extra-boolean-cast": 0, "no-lonely-if": 0, "no-underscore-dangle": 0, + "import/prefer-default-export": 0, 'import/extensions': ['error', 'always', { "js": "never" }] diff --git a/CHANGELOG.md b/CHANGELOG.md index 8b13789..732bf85 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1 +1,7 @@ +## 3.0.0 +- Rename class and global variable `VueLocalStorage` to `VueStorage` +## 2.4.0 + - Added session storage + - Added memory storage + - Added the ability to name a variable diff --git a/build/rollup.config.js b/build/rollup.config.js index 39bfdf0..b3d4907 100644 --- a/build/rollup.config.js +++ b/build/rollup.config.js @@ -1,9 +1,11 @@ import babel from 'rollup-plugin-babel'; import uglify from 'rollup-plugin-uglify'; +import localResolve from 'rollup-plugin-local-resolve'; export default { input: 'src/index.js', plugins: [ + localResolve(), babel({ babelrc: false, presets: [ @@ -37,6 +39,6 @@ export default { output: { file: process.env.NODE_ENV === 'production' ? 'dist/vue-ls.min.js' : 'dist/vue-ls.js', format: 'umd', - name: 'VueLocalStorage', + name: 'VueStorage', } }; diff --git a/dist/vue-ls.js b/dist/vue-ls.js index 673e34c..32fdb23 100644 --- a/dist/vue-ls.js +++ b/dist/vue-ls.js @@ -1,196 +1,128 @@ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : - (global.VueLocalStorage = factory()); + (global.VueStorage = factory()); }(this, (function () { 'use strict'; -var ls = {}; - -var memoryStorage = { - /** - * Get item - * - * @param {string} name - * @returns {*} - */ - getItem: function getItem(name) { - return name in ls ? ls[name] : null; - }, - - - /** - * Set item - * - * @param {string} name - * @param {*} value - * @returns {boolean} - */ - setItem: function setItem(name, value) { - ls[name] = value; - - return true; - }, - - - /** - * Remove item - * - * @param {string} name - * @returns {boolean} - */ - removeItem: function removeItem(name) { - var found = name in ls; - - if (found) { - return delete ls[name]; - } - - return false; - }, - - - /** - * Clear storage - * - * @returns {boolean} - */ - clear: function clear() { - ls = {}; - - return true; - }, - +var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - /** - * Get item by key - * - * @param {number} index - * @returns {*} - */ - key: function key(index) { - var keys = Object.keys(ls); +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - return typeof keys[index] !== 'undefined' ? keys[index] : null; - } -}; +var ls = {}; -Object.defineProperty(memoryStorage, 'length', { - /** - * Define length property - * - * @return {number} - */ - get: function get() { - return Object.keys(ls).length; +var MemoryStorage = function () { + function MemoryStorage() { + _classCallCheck(this, MemoryStorage); } -}); - -var _createClass$1 = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); -function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -var listeners = {}; - -/** - * Event class - */ + _createClass(MemoryStorage, null, [{ + key: 'getItem', -var _class$1 = function () { - function _class() { - _classCallCheck$1(this, _class); - } - - _createClass$1(_class, null, [{ - key: 'on', + /** + * Get item + * + * @param {string} name + * @returns {*} + */ + value: function getItem(name) { + return name in ls ? ls[name] : null; + } /** - * Add storage change event + * Set item * * @param {string} name - * @param {Function} callback + * @param {*} value + * @returns {boolean} */ - value: function on(name, callback) { - if (typeof listeners[name] === 'undefined') { - listeners[name] = []; - } - listeners[name].push(callback); + }, { + key: 'setItem', + value: function setItem(name, value) { + ls[name] = value; + + return true; } /** - * Remove storage change event + * Remove item * * @param {string} name - * @param {Function} callback + * @returns {boolean} */ }, { - key: 'off', - value: function off(name, callback) { - if (listeners[name].length) { - listeners[name].splice(listeners[name].indexOf(callback), 1); - } else { - listeners[name] = []; + key: 'removeItem', + value: function removeItem(name) { + var found = name in ls; + + if (found) { + return delete ls[name]; } + + return false; } /** - * Emit event + * Clear storage * - * @param {Object} event + * @returns {boolean} */ }, { - key: 'emit', - value: function emit(event) { - var e = event || window.event; + key: 'clear', + value: function clear() { + ls = {}; - var getValue = function getValue(data) { - try { - return JSON.parse(data).value; - } catch (err) { - return data; - } - }; + return true; + } - var fire = function fire(listener) { - var newValue = getValue(e.newValue); - var oldValue = getValue(e.oldValue); + /** + * Get item by key + * + * @param {number} index + * @returns {*} + */ - listener(newValue, oldValue, e.url || e.uri); - }; + }, { + key: 'key', + value: function key(index) { + var keys = Object.keys(ls); - if (typeof e === 'undefined' || typeof e.key === 'undefined') { - return; - } + return typeof keys[index] !== 'undefined' ? keys[index] : null; + } - var all = listeners[e.key]; + /** + * Define length property + * + * @return {number} + */ - if (typeof all !== 'undefined') { - all.forEach(fire); - } + }, { + key: 'length', + get: function get() { + return Object.keys(ls).length; } }]); - return _class; + return MemoryStorage; }(); var _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); +var _createClass$1 = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } /** * Storage Bridge */ - -var _class = function () { +var WebStorage$$1 = function () { /** * @param {Object} storage */ - function _class(storage) { - _classCallCheck(this, _class); + function WebStorage$$1(storage) { + _classCallCheck$1(this, WebStorage$$1); this.storage = storage; this.options = { @@ -212,11 +144,11 @@ var _class = function () { if (typeof window !== 'undefined') { for (var i in this.options.events) { if (window.addEventListener) { - window.addEventListener(this.options.events[i], _class$1.emit, false); + window.addEventListener(this.options.events[i], WebStorageEvent.emit, false); } else if (window.attachEvent) { - window.attachEvent('on' + this.options.events[i], _class$1.emit); + window.attachEvent('on' + this.options.events[i], WebStorageEvent.emit); } else { - window['on' + this.options.events[i]] = _class$1.emit; + window['on' + this.options.events[i]] = WebStorageEvent.emit; } } } @@ -229,7 +161,7 @@ var _class = function () { */ - _createClass(_class, [{ + _createClass$1(WebStorage$$1, [{ key: 'setOptions', value: function setOptions() { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; @@ -359,7 +291,55 @@ var _class = function () { }, { key: 'on', value: function on(name, callback) { - _class$1.on(this.options.namespace + name, callback); + WebStorageEvent.on(this.options.namespace + name, callback); + } + + /** + * Remove storage change event + * + * @param {string} name + * @param {Function} callback + */ + + }, { + key: 'off', + value: function off(name, callback) { + WebStorageEvent.off(this.options.namespace + name, callback); + } + }]); + + return WebStorage$$1; +}(); + +var _createClass$2 = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +var listeners = {}; + +/** + * Event class + */ +var WebStorageEvent = function () { + function WebStorageEvent() { + _classCallCheck$2(this, WebStorageEvent); + } + + _createClass$2(WebStorageEvent, null, [{ + key: 'on', + + /** + * Add storage change event + * + * @param {string} name + * @param {Function} callback + */ + value: function on(name, callback) { + if (typeof listeners[name] === 'undefined') { + listeners[name] = []; + } + + listeners[name].push(callback); } /** @@ -372,31 +352,75 @@ var _class = function () { }, { key: 'off', value: function off(name, callback) { - _class$1.off(this.options.namespace + name, callback); + if (listeners[name].length) { + listeners[name].splice(listeners[name].indexOf(callback), 1); + } else { + listeners[name] = []; + } + } + + /** + * Emit event + * + * @param {Object} event + */ + + }, { + key: 'emit', + value: function emit(event) { + var e = event || window.event; + + var getValue = function getValue(data) { + try { + return JSON.parse(data).value; + } catch (err) { + return data; + } + }; + + var fire = function fire(listener) { + var newValue = getValue(e.newValue); + var oldValue = getValue(e.oldValue); + + listener(newValue, oldValue, e.url || e.uri); + }; + + if (typeof e === 'undefined' || typeof e.key === 'undefined') { + return; + } + + var all = listeners[e.key]; + + if (typeof all !== 'undefined') { + all.forEach(fire); + } } }]); - return _class; + return WebStorageEvent; }(); var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; +// eslint-disable-next-line +var _global = typeof window !== 'undefined' ? window : global || {}; + /** - * @type {{install: (function(Object, Object): Storage)}} + * @type {{install: (function(Object, Object): WebStorage)}} */ -var VueLocalStorage = { +var VueStorage = { /** * Install plugin * * @param {Object} Vue * @param {Object} options - * @returns {Storage} + * @returns {WebStorage} */ install: function install(Vue) { var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; var _options = _extends({}, options, { - storage: !!options.storage ? options.storage : 'local', + storage: options.storage || 'local', name: options.name || 'ls' }); @@ -408,24 +432,24 @@ var VueLocalStorage = { switch (_options.storage) {// eslint-disable-line case 'local': - store = typeof window !== 'undefined' && 'localStorage' in window ? window.localStorage : null; + store = 'localStorage' in _global ? _global.localStorage : null; break; case 'session': - store = typeof window !== 'undefined' && 'sessionStorage' in window ? window.sessionStorage : null; + store = 'sessionStorage' in _global ? _global.sessionStorage : null; break; case 'memory': - store = memoryStorage; + store = MemoryStorage; break; } if (!store) { - store = memoryStorage; + store = MemoryStorage; // eslint-disable-next-line console.error('Vue-ls: Storage "' + _options.storage + '" is not supported your system, use memory storage'); } - var ls = new _class(store); + var ls = new WebStorage$$1(store); ls.setOptions(_extends(ls.options, { namespace: '' @@ -436,7 +460,7 @@ var VueLocalStorage = { /** * Define $ls property * - * @return {Storage} + * @return {WebStorage} */ get: function get() { return ls; @@ -445,10 +469,8 @@ var VueLocalStorage = { } }; -if (typeof window !== 'undefined') { - window.VueLocalStorage = VueLocalStorage; -} +_global.VueStorage = VueStorage; -return VueLocalStorage; +return VueStorage; }))); diff --git a/dist/vue-ls.min.js b/dist/vue-ls.min.js index c2b2130..d54749f 100644 --- a/dist/vue-ls.min.js +++ b/dist/vue-ls.min.js @@ -1 +1 @@ -!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.VueLocalStorage=n()}(this,function(){"use strict";var e={},n={getItem:function(n){return n in e?e[n]:null},setItem:function(n,t){return e[n]=t,!0},removeItem:function(n){return!!(n in e)&&delete e[n]},clear:function(){return e={},!0},key:function(n){var t=Object.keys(e);return void 0!==t[n]?t[n]:null}};Object.defineProperty(n,"length",{get:function(){return Object.keys(e).length}});var t=function(){function e(e,n){for(var t=0;t0&&void 0!==arguments[0]?arguments[0]:{};this.options=i(this.options,e)}},{key:"set",value:function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,o=JSON.stringify({value:n,expire:null!==t?(new Date).getTime()+t:null});this.storage.setItem(this.options.namespace+e,o)}},{key:"get",value:function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,t=this.storage.getItem(this.options.namespace+e);if(null!==t)try{var o=JSON.parse(t);if(null===o.expire)return o.value;if(o.expire>=(new Date).getTime())return o.value;this.remove(e)}catch(e){return n}return n}},{key:"key",value:function(e){return this.storage.key(e)}},{key:"remove",value:function(e){return this.storage.removeItem(this.options.namespace+e)}},{key:"clear",value:function(){if(0!==this.length){for(var e=[],n=0;n1&&void 0!==arguments[1]?arguments[1]:{},o=u({},t,{storage:t.storage?t.storage:"local",name:t.name||"ls"});if(o.storage&&-1===["memory","local","session"].indexOf(o.storage))throw new Error('Vue-ls: Storage "'+o.storage+'" is not supported');var r=null;switch(o.storage){case"local":r="undefined"!=typeof window&&"localStorage"in window?window.localStorage:null;break;case"session":r="undefined"!=typeof window&&"sessionStorage"in window?window.sessionStorage:null;break;case"memory":r=n}r||(r=n,console.error('Vue-ls: Storage "'+o.storage+'" is not supported your system, use memory storage'));var i=new s(r);i.setOptions(u(i.options,{namespace:""},o||{})),e[o.name]=i,Object.defineProperty(e.prototype,"$"+o.name,{get:function(){return i}})}};return"undefined"!=typeof window&&(window.VueLocalStorage=l),l}); +!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.VueStorage=n()}(this,function(){"use strict";var e=function(){function e(e,n){for(var t=0;t0&&void 0!==arguments[0]?arguments[0]:{};this.options=o(this.options,e)}},{key:"set",value:function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,o=JSON.stringify({value:n,expire:null!==t?(new Date).getTime()+t:null});this.storage.setItem(this.options.namespace+e,o)}},{key:"get",value:function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,t=this.storage.getItem(this.options.namespace+e);if(null!==t)try{var o=JSON.parse(t);if(null===o.expire)return o.value;if(o.expire>=(new Date).getTime())return o.value;this.remove(e)}catch(e){return n}return n}},{key:"key",value:function(e){return this.storage.key(e)}},{key:"remove",value:function(e){return this.storage.removeItem(this.options.namespace+e)}},{key:"clear",value:function(){if(0!==this.length){for(var e=[],n=0;n1&&void 0!==arguments[1]?arguments[1]:{},o=l({},n,{storage:n.storage||"local",name:n.name||"ls"});if(o.storage&&-1===["memory","local","session"].indexOf(o.storage))throw new Error('Vue-ls: Storage "'+o.storage+'" is not supported');var r=null;switch(o.storage){case"local":r="localStorage"in c?c.localStorage:null;break;case"session":r="sessionStorage"in c?c.sessionStorage:null;break;case"memory":r=t}r||(r=t,console.error('Vue-ls: Storage "'+o.storage+'" is not supported your system, use memory storage'));var a=new i(r);a.setOptions(l(a.options,{namespace:""},o||{})),e[o.name]=a,Object.defineProperty(e.prototype,"$"+o.name,{get:function(){return a}})}};return c.VueStorage=f,f}); diff --git a/examples/counter/index.html b/examples/counter/index.html index bdec4a8..9e4bb6a 100644 --- a/examples/counter/index.html +++ b/examples/counter/index.html @@ -19,7 +19,7 @@

Synchronized tab counter