Merge pull request #29 from dreambo8563/develop

1.2.1

CHANGELOG.md

@@ -1,5 +1,20 @@
+<a name="1.2.1"></a>
+## [1.2.1](https://github.com/dreambo8563/vue-storage-watcher/compare/1.1.3...1.2.1) (2019-02-20)
+
+
+### Bug Fixes
+
+* **expire:** when getItem and it's expired, we should emit the subscribers with null ([9e0fa77](https://github.com/dreambo8563/vue-storage-watcher/commit/9e0fa77))
+
+
+### Features
+
+* **ttl:** add ttl method ([abbd794](https://github.com/dreambo8563/vue-storage-watcher/commit/abbd794))
+
+
+
 <a name="1.1.3"></a>
-## [1.1.3](https://github.com/dreambo8563/vue-storage-watcher/compare/v1.1.2...v1.1.3) (2019-02-19)
+## [1.1.3](https://github.com/dreambo8563/vue-storage-watcher/compare/1.1.2...v1.1.3) (2019-02-19)
 
 
 

README.md

@@ -26,7 +26,7 @@ TODO:
 
 - [x] support sessionStorage
 - [x] logo design
-- [ ] ttl method like redis to get remaining lifetime in ms
+- [x] ttl method like redis to get remaining lifetime in ms
 - [ ] show usage with github pages maybe
 
 ### Install
@@ -75,6 +75,20 @@ this.$ls.set("token", "abccc", 3000)
 
 the key will be expried in 3s, you will get null after that.
 
+#### ttl
+
+ttl will return **-1** if one of the following scenarios happen:
+
+- the key is non-exist
+- the key is already expired
+- the key has no expire time
+
+else return the remaining lifetime with ms as the unit
+
+```js
+this.$ls.ttl("token)
+```
+
 #### get
 
 ```js

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-storage-watcher",
-  "version": "1.1.3",
+  "version": "1.2.1",
   "author": "dreambo8563",
   "main": "dist/vue-storage-watcher.umd.min.js",
   "private": false,

src/main.ts

@@ -5,7 +5,6 @@ export type lsOption = {
   storage?: "local" | "session";
 };
 interface ILSWatcher {
-  // constuctor(op: lsOption): void;
   on(key: string, fn: Function, immediate?: boolean): Symbol;
   set(key: string, payload: any, expire?: number | null): void;
   broadcast(key: string, payload?: any): void;
@@ -16,6 +15,7 @@ interface ILSWatcher {
   init(): void;
   remove(key: string): void;
   off(key: string, handler: Symbol): void;
+  ttl(key: string): number;
 }
 class LSWatcher {
   // internal event queue 内置事件队列
@@ -39,6 +39,7 @@ class LSWatcher {
     }
   }
   // 注册事件
+  // register the event of the key
   on(key: string, fn: Function, immediate: boolean = false): Symbol {
     if (typeof fn !== "function") {
       throw new Error("the second arg should be the callback function");
@@ -58,12 +59,14 @@ class LSWatcher {
   //赋值
   set(key: string, payload: any, expire: number | null = null): void {
     // 先存入 ls
+    // save into storage
     const stringifyValue = JSON.stringify({
       value: payload,
       expire: expire !== null ? new Date().getTime() + expire : null
     });
     this.storageObj.setItem(this.prefix + key, stringifyValue);
     // 通知订阅者
+    // inform subscribers
     this.broadcast(this.prefix + key, payload);
   }
   broadcast(key: string, payload: any = null): void {
@@ -86,6 +89,7 @@ class LSWatcher {
   }
   /**
    * 是否有人订阅了这个key
+   * check if there is any subscriber of the key
    *
    * @param {string} key
    * @returns {boolean}
@@ -120,24 +124,46 @@ class LSWatcher {
   get(key: string, def = null): any {
     const item = this.storageObj.getItem(this.prefix + key);
 
-    if (item !== null) {
-      try {
-        const data = JSON.parse(item);
+    if (item == null) {
+      return def;
+    }
+    try {
+      const data = JSON.parse(item);
 
-        if (data.expire === null) {
-          return data.value;
-        }
+      if (data.expire === null) {
+        return data.value;
+      }
 
-        if (data.expire >= new Date().getTime()) {
-          return data.value;
-        }
-        this.storageObj.removeItem(this.prefix + key);
-      } catch {
-        return def;
+      if (data.expire >= new Date().getTime()) {
+        return data.value;
       }
+      this.remove(key);
+    } catch {
+      return def;
+    }
+  }
+  /**
+   * if the key non-exist / no expire time / already expired  return -1,
+   * else return remaining lifetime with unit of ms
+   *
+   * @param {string} key
+   * @returns {number}
+   * @memberof LSWatcher
+   */
+  ttl(key: string): number {
+    const item = this.storageObj.getItem(this.prefix + key);
+    if (item == null) {
+      return -1;
+    }
+    try {
+      const data = JSON.parse(item);
+      if (data.expire >= new Date().getTime()) {
+        return data.expire - new Date().getTime();
+      }
+      return -1;
+    } catch {
+      return -1;
     }
-
-    return def;
   }
   init(): void {
     const keys = Object.keys(this.storageObj);
@@ -167,12 +193,12 @@ class LSWatcher {
     this.storageObj.removeItem(this.prefix + key);
     this.broadcast(this.prefix + key);
   }
-  // 取消订阅
+  // 取消订阅 - unsubscribe
   off(key: string, handler: Symbol): void {
     this.queue.get(this.prefix + key)!.delete(handler);
   }
 }
-// 暂时只用单例
+// 暂时只用单例 - single instance
 export type LsWatcherPlugin = {
   install(vue: VueConstructor<Vue>, options: lsOption): void;
 };

types/main.d.ts

@@ -14,6 +14,7 @@ interface ILSWatcher {
   init(): void;
   remove(key: string): void;
   off(key: string, handler: Symbol): void;
+  ttl(key: string): number;
 }
 export declare type LsWatcherPlugin = {
   install(vue: VueConstructor<Vue>, options: lsOption): void;