mobdim / __se__

JavaScript library for exchange events, data and tasks between browser tabs.

__SE__ (SharedEvents)

JavaScript library for exchange events, data and tasks between browser tabs.

Подробный мануал на русском на Хабрахабре - если кто-нибудь переведёт всю эту лабуду на английский, буду очень признателен. :)

Requirements

1. Blob
2. Blob.URL
3. Worker
4. localStorage

API:

Options:
__SE__.Name - This tab name.
__SE__.SelfExecution - Self-emitting by not _Global events.
__SE__.Sync - Background worker interval in ms.
__SE__.TabTimeoutMult - Ctrl+F: "Inner relative values".
__SE__.SLockTimeoutMult - Ctrl+F: "Inner relative values".

Methods:
__SE__.clear( void );
__SE__.getActiveTabs( void );

__SE__.addEventListener ( Type , Listener [, TabName ] );
__SE__.hasEventListener ( Type [, Listener , TabName , Callback ] );
__SE__.removeEventListener ( Type [, Listener , TabName , Callback ] );
__SE__.dispatchEvent ( Type [, Data , TabName ] );

Constants:
__SE__.GID - global events and listeners target ("TabName") identifier.

Default global events:
tabOpened - { Name , ID } as GlobalEvent tabName: __SE__.GID
tabClosed - { Name , ID } as GlobalEvent tabName: __SE__.GID
tabNameChanged - { Name , ID , OldName } as GlobalEvent tabName: __SE__.GID

Inner relative values:

1. Tab ping timeout expression: __SE__.Sync * __SE__.ActiveTabsCount * __SE__.TabTimeoutMult
   
2. Storage lock timeout expression: __SE__.Sync * __SE__.SLockTimeoutMult
   

Examples:

Set local event listeners to default global events:

    var testFunction = function( data ){
        console.log( 'Local __SE__ event called on tabOpened.' );
        console.dir( data );
    };
    __SE__.addEventListener( 'tabOpened' , testFunction );

    var testFunctionB = function( data ){
        console.log( 'Local __SE__ event called on tabClosed.' );
        console.dir( data );
    };
    __SE__.addEventListener( 'tabClosed' , testFunctionB );

Local add/has/remove listeners:

    var testFunction = function( data ){
        console.log( 'Local __SE__ event called on TestEvent.' );
        console.dir( data );
    };
    var testResult = __SE__.addEventListener( 'TestEvent' , testFunction );
    console.log( 'Listener attachment result: ' + testResult );
console.log( 'Tests:' );

console.log( 'hasEventListener():' );
console.log( 'Expected "false", recieved: ' + __SE__.hasEventListener( 'Empty'      , testFunction ) );
console.log( 'Expected "false", recieved: ' + __SE__.hasEventListener( 'Empty'      , false ) );
console.log( 'Expected "true", recieved: '  + __SE__.hasEventListener( 'TestEvent'  , testFunction ) );
console.log( 'Expected "true", recieved: '  + __SE__.hasEventListener( 'TestEvent'  , false ) );

console.log( 'removeEventListener():' );
console.log( 'Expected "true", recieved: '  + __SE__.removeEventListener( 'Empty'       , testFunction ) );
console.log( 'Expected "true", recieved: '  + __SE__.removeEventListener( 'TestEvent'   , testFunction ) );
console.log( 'Expected "true", recieved: '  + __SE__.removeEventListener( 'TestEvent'   , testFunction ) );




Set local event listeners to tab-specified events:
    // part 1 (tab 1)
    var testFunction = function( data ){
        console.log( 'Local __SE__ event called on TestEvent.' );
        console.dir( data );
    };
    __SE__.addEventListener( 'TestEvent' , testFunction );
    __SE__.setName( 'Reciever' );
// part 2 (tab 2-3-4-n)
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } , 'UndefinedTab' ); // false, because send to 'UndefinedTab'
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } ); // true, because '_Global'
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } , 'Reciever' ); // true, because tab-specified




Set shared event listeners to tab-specified events:
    // part 1 (tab 1)
    var testFunction = function( data ){
        console.log( 'Shared __SE__ listener called on TestEvent.' );
        console.dir( data );
    };
    __SE__.addEventListener( 'TestEvent' , testFunction , 'Reciever' );
    __SE__.addEventListener( 'TestEvent' , testFunction , 'Tester' );
// part 2 (tab 2)
__SE__.setName( 'Reciever' );

// part 3 (tab 3)
__SE__.setName( 'Tester' );

// part 4 (tab 4)
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } , 'UndefinedTab' ); // TAB2 && TAB3: false, because send to 'UndefinedTab'
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } ); // TAB2 && TAB3: true, because '_Global'
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } , 'Reciever' ); // TAB2: true, because specified; TAB3: false
__SE__.dispatchEvent( 'TestEvent' , { Data: 'some data' } , 'Tester' ); // TAB3: true, because specified; TAB2: false




Shared events hasEventListener:
    // part 1 (tab 1)
    var testFunction = function( data ){
        console.log( 'Shared __SE__ listener called on TestEvent.' );
        console.dir( data );
    };
    __SE__.addEventListener( 'TestEvent' , testFunction , 'Reciever' );
// part 2 (tab 1)
var Callback = function( result ){
    if ( result ){
        console.log( 'TRUE! Listener exists.' );
    } else {
        console.log( 'FALSE! Listener not exists.' );
    }
}

__SE__.hasEventListener( 'TestEvent' , testFunction , 'Reciever' , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , testFunction , 'Reciever' , Callback ); // false
__SE__.hasEventListener( 'TestEvent' , testFunction , false , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , testFunction , false , Callback ); // false
__SE__.hasEventListener( 'TestEvent' , false , 'Reciever' , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , false , 'Reciever' , Callback ); // false
__SE__.hasEventListener( 'TestEvent' , false , false , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , false , false , Callback ); // false

// part 3 (tab 2)
var testFunction = function( data ){
    console.log( 'Shared __SE__ listener called on TestEvent.' );
    console.dir( data );
};

var Callback = function( result ){
    if ( result ){
        console.log( 'TRUE! Listener exists.' );
    } else {
        console.log( 'FALSE! Listener not exists.' );
    }
}

__SE__.hasEventListener( 'TestEvent' , testFunction , 'Reciever' , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , testFunction , 'Reciever' , Callback ); // false
__SE__.hasEventListener( 'TestEvent' , testFunction , false , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , testFunction , false , Callback ); // false
__SE__.hasEventListener( 'TestEvent' , false , 'Reciever' , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , false , 'Reciever' , Callback ); // false
__SE__.hasEventListener( 'TestEvent' , false , false , Callback ); // true
__SE__.hasEventListener( 'TestEventB' , false , false , Callback ); // false