JavaScript library for exchange events, data and tasks between browser tabs.
Подробный мануал на русском на Хабрахабре - если кто-нибудь переведёт всю эту лабуду на английский, буду очень признателен. :)
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:
- Tab ping timeout expression: __SE__.Sync * __SE__.ActiveTabsCount * __SE__.TabTimeoutMult
- Storage lock timeout expression: __SE__.Sync * __SE__.SLockTimeoutMult
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
Recommend Projects
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
Recommend Topics
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web
Some thing interesting about web. New door for the world.
server
A server is a program made to process requests and deliver data to clients.
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization
Some thing interesting about visualization, use data art
Game
Some thing interesting about game, make everyone happy.
Recommend Org
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.
Jobs
Jooble