iframe.io 1.0.0 → 1.0.2

package/dist/index.d.ts

@@ -3,7 +3,6 @@ export declare type CallbackFunction = (error: boolean | string, ...args: any[])
 export declare type Listener = (payload?: any, callback?: CallbackFunction) => void;
 export declare type Options = {
     type?: PeerType;
-    debug?: boolean;
 };
 export interface RegisteredEvents {
     [index: string]: Listener[];
@@ -16,7 +15,7 @@ export declare type Peer = {
 export declare type MessageData = {
     _event: string;
     payload: any;
-    callback: boolean;
+    cid: boolean;
 };
 export declare type Message = {
     origin: string;
@@ -31,8 +30,8 @@ export default class IOF {
     debug(...args: any[]): void;
     initiate(contentWindow: MessageEventSource, iframeOrigin: string): this;
     listen(hostOrigin?: string): this;
-    fire(_event: string, payload?: MessageData['payload'], callback?: boolean): void;
-    emit(_event: string, payload?: MessageData['payload'], fn?: Listener): this;
+    fire(_event: string, payload?: MessageData['payload'], cid?: boolean): void;
+    emit(_event: string, payload?: MessageData['payload'], fn?: CallbackFunction): this;
     on(_event: string, fn: Listener): this;
     once(_event: string, fn: Listener): this;
     off(_event: string, fn?: Listener): this;

package/dist/index.js

@@ -23,6 +23,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 function newObject(data) {
     return JSON.parse(JSON.stringify(data));
 }
+var callbackId = function () {
+    var rmin = 10, rmax = 9999;
+    return Date.now() + String(Math.floor(Math.random() * (rmax - rmin + 1) + (rmin + 1)));
+};
 var IOF = /** @class */ (function () {
     function IOF(options) {
         if (options && typeof options !== 'object')
@@ -38,7 +42,7 @@ var IOF = /** @class */ (function () {
         for (var _i = 0; _i < arguments.length; _i++) {
             args[_i] = arguments[_i];
         }
-        this.options && this.options.debug && console.log.apply(console, args);
+        console.debug.apply(console, args);
     };
     IOF.prototype.initiate = function (contentWindow, iframeOrigin) {
         var _this = this;
@@ -57,7 +61,7 @@ var IOF = /** @class */ (function () {
                 || typeof data !== 'object'
                 || !data.hasOwnProperty('_event'))
                 return;
-            var _b = data, _event = _b._event, payload = _b.payload, callback = _b.callback;
+            var _b = data, _event = _b._event, payload = _b.payload, cid = _b.cid;
             _this.debug("[".concat(_this.peer.type, "] Message: ").concat(_event), payload || '');
             // Handshake or availability check events
             if (_event == 'pong') {
@@ -66,7 +70,7 @@ var IOF = /** @class */ (function () {
                 return _this.debug("[".concat(_this.peer.type, "] connected"));
             }
             // Fire available event listeners
-            _this.fire(_event, payload, callback);
+            _this.fire(_event, payload, cid);
         }, false);
         this.debug("[".concat(this.peer.type, "] Initiate connection: IFrame origin <").concat(iframeOrigin, ">"));
         this.emit('ping');
@@ -95,7 +99,7 @@ var IOF = /** @class */ (function () {
             // Origin different from handshaked source origin
             else if (origin !== _this.peer.origin)
                 throw new Error('Invalid Origin');
-            var _event = data._event, payload = data.payload, callback = data.callback;
+            var _event = data._event, payload = data.payload, cid = data.cid;
             _this.debug("[".concat(_this.peer.type, "] Message: ").concat(_event), payload || '');
             // Handshake or availability check events
             if (_event == 'ping') {
@@ -105,23 +109,23 @@ var IOF = /** @class */ (function () {
                 return _this.debug("[".concat(_this.peer.type, "] connected"));
             }
             // Fire available event listeners
-            _this.fire(_event, payload, callback);
+            _this.fire(_event, payload, cid);
         }, false);
         return this;
     };
-    IOF.prototype.fire = function (_event, payload, callback) {
+    IOF.prototype.fire = function (_event, payload, cid) {
         var _this = this;
         // Volatile event
         if (!this.Events[_event]
             && !this.Events[_event + '--@once'])
             return this.debug("[".concat(this.peer.type, "] No <").concat(_event, "> listener defined"));
-        var callbackFn = callback ?
+        var callbackFn = cid ?
             function (error) {
                 var args = [];
                 for (var _i = 1; _i < arguments.length; _i++) {
                     args[_i - 1] = arguments[_i];
                 }
-                _this.emit(_event + '--@callback', { error: error || false, args: args });
+                _this.emit("".concat(_event, "--").concat(cid, "--@callback"), { error: error || false, args: args });
                 return;
             } : undefined;
         var listeners = [];
@@ -135,7 +139,7 @@ var IOF = /** @class */ (function () {
         else
             listeners = this.Events[_event];
         // Fire listeners
-        listeners.map(function (fn) { return payload ? fn(payload, callbackFn) : fn(callbackFn); });
+        listeners.map(function (fn) { return payload !== undefined ? fn(payload, callbackFn) : fn(callbackFn); });
     };
     IOF.prototype.emit = function (_event, payload, fn) {
         if (!this.peer.source)
@@ -145,16 +149,16 @@ var IOF = /** @class */ (function () {
             payload = null;
         }
         // Acknowledge/callback event listener
-        var hasCallback = false;
+        var cid;
         if (typeof fn === 'function') {
             var callbackFunction_1 = fn;
-            this.once(_event + '--@callback', function (_a) {
+            cid = callbackId();
+            this.once("".concat(_event, "--").concat(cid, "--@callback"), function (_a) {
                 var error = _a.error, args = _a.args;
                 return callbackFunction_1.apply(void 0, __spreadArray([error], args, false));
             });
-            hasCallback = true;
         }
-        this.peer.source.postMessage(newObject({ _event: _event, payload: payload, callback: hasCallback }), this.peer.origin);
+        this.peer.source.postMessage(newObject({ _event: _event, payload: payload, cid: cid }), this.peer.origin);
         return this;
     };
     IOF.prototype.on = function (_event, fn) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iframe.io",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Easy and friendly API to connect and interact between content window and its containing iframe",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/src/index.ts

@@ -6,7 +6,7 @@ export type Listener = ( payload?: any, callback?: CallbackFunction ) => void
 
 export type Options = {
   type?: PeerType
-  debug?: boolean
+  // debug?: boolean
 }
 
 export interface RegisteredEvents {
@@ -22,7 +22,7 @@ export type Peer = {
 export type MessageData = {
   _event: string
   payload: any
-  callback: boolean
+  cid: boolean
 }
 
 export type Message = {
@@ -35,14 +35,17 @@ function newObject( data: object ){
   return JSON.parse( JSON.stringify( data ) )
 }
 
-export default class IOF {
+const callbackId = () => {
+  const rmin = 10, rmax = 9999
+  return Date.now() + String( Math.floor( Math.random() * ( rmax - rmin + 1 )+( rmin + 1 ) ) )
+}
 
+export default class IOF {
   Events: RegisteredEvents
   peer: Peer
   options: Options
 
   constructor( options: Options ){
-
     if( options && typeof options !== 'object' )
       throw new Error('Invalid Options')
     
@@ -54,7 +57,7 @@ export default class IOF {
       this.peer.type = options.type.toUpperCase() as PeerType
   }
 
-  debug( ...args: any[] ){ this.options && this.options.debug && console.log( ...args ) }
+  debug( ...args: any[] ){ console.debug( ...args ) }
 
   initiate( contentWindow: MessageEventSource, iframeOrigin: string ){
     // Establish a connection with an iframe containing in the current window
@@ -74,7 +77,7 @@ export default class IOF {
           || typeof data !== 'object'
           || !data.hasOwnProperty('_event') ) return
           
-      const { _event, payload, callback } = data as Message['data']
+      const { _event, payload, cid } = data as Message['data']
       this.debug( `[${this.peer.type}] Message: ${_event}`, payload || '' )
 
       // Handshake or availability check events
@@ -85,7 +88,7 @@ export default class IOF {
       }
 
       // Fire available event listeners
-      this.fire( _event, payload, callback )
+      this.fire( _event, payload, cid )
     }, false )
 
     this.debug(`[${this.peer.type}] Initiate connection: IFrame origin <${iframeOrigin}>`)
@@ -120,7 +123,7 @@ export default class IOF {
       else if( origin !== this.peer.origin )
         throw new Error('Invalid Origin')
       
-      const { _event, payload, callback } = data
+      const { _event, payload, cid } = data
       this.debug( `[${this.peer.type}] Message: ${_event}`, payload || '' )
 
       // Handshake or availability check events
@@ -133,21 +136,21 @@ export default class IOF {
       }
 
       // Fire available event listeners
-      this.fire( _event, payload, callback )
+      this.fire( _event, payload, cid )
     }, false )
 
     return this
   }
 
-  fire( _event: string, payload?: MessageData['payload'], callback?: boolean ){
+  fire( _event: string, payload?: MessageData['payload'], cid?: boolean ){
     // Volatile event
     if( !this.Events[ _event ] 
         && !this.Events[ _event +'--@once'] )
       return this.debug(`[${this.peer.type}] No <${_event}> listener defined`)
 
-    const callbackFn = callback ? 
+    const callbackFn = cid ?
                   ( error: boolean | string, ...args: any[] ): void => {
-                    this.emit( _event +'--@callback', { error: error || false, args } )
+                    this.emit(`${_event}--${cid}--@callback`, { error: error || false, args } )
                     return
                   } : undefined
     let listeners: Listener[] = []
@@ -162,10 +165,10 @@ export default class IOF {
     else listeners = this.Events[ _event ]
     
     // Fire listeners
-    listeners.map( fn => payload ? fn( payload, callbackFn ) : fn( callbackFn ) )
+    listeners.map( fn => payload !== undefined ? fn( payload, callbackFn ) : fn( callbackFn ) )
   }
 
-  emit( _event: string, payload?: MessageData['payload'], fn?: Listener ){
+  emit( _event: string, payload?: MessageData['payload'], fn?: CallbackFunction ){
 
     if( !this.peer.source )
       throw new Error('No Connection initiated')
@@ -176,15 +179,15 @@ export default class IOF {
 		}
 
     // Acknowledge/callback event listener
-    let hasCallback = false
+    let cid
     if( typeof fn === 'function' ){
-      const callbackFunction = fn as CallbackFunction
+      const callbackFunction = fn
 
-		  this.once( _event +'--@callback', ({ error, args }) => callbackFunction( error, ...args ) )
-      hasCallback = true
+      cid = callbackId()
+		  this.once(`${_event}--${cid}--@callback`, ({ error, args }) => callbackFunction( error, ...args ) )
     }
     
-    this.peer.source.postMessage( newObject({ _event, payload, callback: hasCallback }), this.peer.origin as string )
+    this.peer.source.postMessage( newObject({ _event, payload, cid }), this.peer.origin as string )
 
 		return this
   }