{"id":13802473,"url":"https://github.com/ArtskydJ/tab-emitter","last_synced_at":"2025-05-13T13:31:27.314Z","repository":{"id":34071932,"uuid":"37862097","full_name":"ArtskydJ/tab-emitter","owner":"ArtskydJ","description":":speech_balloon: An event emitter between browser tabs (same-origin only)","archived":false,"fork":false,"pushed_at":"2020-06-22T14:46:01.000Z","size":152,"stargazers_count":37,"open_issues_count":4,"forks_count":12,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-05-14T02:42:36.231Z","etag":null,"topics":["bazaar","broadcast","browser","browserify","crosstab","demo","emitter","event-emitter","ipc","node","pub","publish","subscribe","tab-emitter","xpc"],"latest_commit_sha":null,"homepage":"https://artskydj.github.io/tab-emitter/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ArtskydJ.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-06-22T15:03:12.000Z","updated_at":"2023-11-11T16:18:03.000Z","dependencies_parsed_at":"2022-07-16T23:16:10.873Z","dependency_job_id":null,"html_url":"https://github.com/ArtskydJ/tab-emitter","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtskydJ%2Ftab-emitter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtskydJ%2Ftab-emitter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtskydJ%2Ftab-emitter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtskydJ%2Ftab-emitter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ArtskydJ","download_url":"https://codeload.github.com/ArtskydJ/tab-emitter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225218078,"owners_count":17439713,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bazaar","broadcast","browser","browserify","crosstab","demo","emitter","event-emitter","ipc","node","pub","publish","subscribe","tab-emitter","xpc"],"created_at":"2024-08-04T00:01:45.187Z","updated_at":"2024-11-18T17:31:28.644Z","avatar_url":"https://github.com/ArtskydJ.png","language":"JavaScript","readme":"# tab-emitter\r\n\r\n\u003e Emit events between browser tabs! (Same-origin only.)\r\n\r\n[![Build Status](https://travis-ci.org/ArtskydJ/tab-emitter.svg?branch=master\u0026cachebuster=20200622)](https://travis-ci.org/ArtskydJ/tab-emitter)\r\n\r\n`tab-emitter` is a client-side javascript module that allows you to send events between browser tabs/windows.\r\nThe sending/recieving web pages must have the [same origin](https://en.wikipedia.org/wiki/Same-origin_policy).\r\nYou can not emit events between browsers, only between the same browser.\r\n\r\n`tab-emitter` is written to work with [browserify](https://github.com/substack/node-browserify). It should work with Rollup and Webpack too.\r\n\r\n# [Demo][demo]\r\n\r\n[![demo site](https://cloud.githubusercontent.com/assets/1833684/10901712/1558f50c-81b9-11e5-8289-6bf496f9edd0.PNG)][demo]\r\n\r\n# Example\r\n\r\n*client1.js*\r\n```js\r\nvar TabEmitter = require('tab-emitter')\r\nvar emitter = TabEmitter()\r\n\r\nsetTimeout(() =\u003e {\r\n\tlet data = { x: 'world' }\r\n\temitter.emit('hello', data)\r\n}, 5000)\r\n\r\nemitter.on('hello', data =\u003e {\r\n\tconsole.log(data.x) // 'world'\r\n})\r\n```\r\n\r\n*client2.js*\r\n```js\r\nvar TabEmitter = require('tab-emitter')\r\nvar emitter = TabEmitter()\r\n\r\nemitter.on('hello', data =\u003e {\r\n\tconsole.log(data.x) // 'world'\r\n})\r\n```\r\n\r\n# Don't use browserify?\r\n\r\nIf you just want to use this module in the browser without dealing with browserify, here's how you can:\r\n\r\n```html\r\n\u003cscript src=\"https://bundle.run/tab-emitter@1.0.11\"\u003e\u003c/script\u003e\r\n\u003cscript\u003e\r\n    var emitter = window.tabEmitter()\r\n    \r\n    emitter.on('event', () =\u003e {\r\n        console.log('event just happened')\r\n    })\r\n    \r\n    setTimeout(() =\u003e {\r\n        emitter.emit('event')\r\n    }, 5000)\r\n\u003c/script\u003e\r\n```\r\n\r\n# API\r\n\r\n```js\r\nvar TabEmitter = require('tab-emitter')\r\n```\r\n\r\n## `var emitter = TabEmitter([key])`\r\n\r\n- `key` is a key to uniquely identify an emitter across tabs. If the same key is used in multiple tabs, they can communicate with each other.\r\n- **Returns** `emitter`, which is an [`EventEmitter`][ee] instance.\r\n\r\n## `emitter.emit(eventName, [...args])`\r\n\r\nEmits an event to its own browser tab, as well as to other browser tabs of the same-origin.\r\n\r\n- `eventName` is a string. `emitter.on` will watch for this string.\r\n- You can have any number of `arg`s. They must be JSON serializable.\r\n\r\n## `emitter.on(eventName, handler)`\r\n\r\nWatches for events on other browser tabs of the same-origin, as well as its own browser tab.\r\n\r\n- `eventName` is a string of the event name to watch for.\r\n- `handler(...args)` is a function that will be called every time the event with the given name is emitted.\r\n\t- `...args` are the arguments passed to `emitter.emit(eventName, ...args)`. The `eventName` is not included.\r\n\r\n## `emitter.once`, `emitter.removeAllListeners`, `emitter.off`, etc.\r\n\r\nFor more extended documentation, please look at the official [`EventEmitter`][ee] documentation. Technically, `EventEmitter` is getting polyfilled by your choice of bundler. Likely with [this module](https://www.npmjs.com/package/events). But the API should be identical.\r\n\r\n\r\n# Install\r\n\r\nWith [npm](https://nodejs.org/en/download) do:\r\n\r\n\tnpm install tab-emitter\r\n\r\n# License\r\n\r\n[MIT](http://choosealicense.com/licenses/mit/)\r\n\r\n[demo]: https://artskydj.github.io/tab-emitter/\r\n[ee]: https://nodejs.org/docs/latest-v10.x/api/events.html\r\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FArtskydJ%2Ftab-emitter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FArtskydJ%2Ftab-emitter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FArtskydJ%2Ftab-emitter/lists"}