{"id":16995024,"url":"https://github.com/jalik/js-observer","last_synced_at":"2025-04-12T05:26:39.709Z","repository":{"id":36463514,"uuid":"111355479","full_name":"jalik/js-observer","owner":"jalik","description":"A library to observe events and trigger callbacks. ","archived":false,"fork":false,"pushed_at":"2024-02-26T20:06:50.000Z","size":2295,"stargazers_count":4,"open_issues_count":2,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-26T00:51:17.871Z","etag":null,"topics":["listener","observable","observer-pattern"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jalik.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2017-11-20T03:07:35.000Z","updated_at":"2023-04-15T01:29:55.000Z","dependencies_parsed_at":"2024-02-26T21:27:12.239Z","dependency_job_id":"2e3d721c-c9ab-4b72-9d81-aa564d583e9f","html_url":"https://github.com/jalik/js-observer","commit_stats":{"total_commits":126,"total_committers":1,"mean_commits":126.0,"dds":0.0,"last_synced_commit":"59221535f02ac6d85cc6177412a2455b1aad7b5b"},"previous_names":["jalik/jk-observer"],"tags_count":28,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jalik%2Fjs-observer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jalik%2Fjs-observer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jalik%2Fjs-observer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jalik%2Fjs-observer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jalik","download_url":"https://codeload.github.com/jalik/js-observer/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248521308,"owners_count":21118048,"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":["listener","observable","observer-pattern"],"created_at":"2024-10-14T03:47:21.887Z","updated_at":"2025-04-12T05:26:39.688Z","avatar_url":"https://github.com/jalik.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @jalik/observer\n\n![GitHub package.json version](https://img.shields.io/github/package-json/v/jalik/js-observer.svg)\n![Build Status](https://github.com/jalik/js-observer/actions/workflows/node.js.yml/badge.svg)\n![GitHub last commit](https://img.shields.io/github/last-commit/jalik/js-observer.svg)\n[![GitHub issues](https://img.shields.io/github/issues/jalik/js-observer.svg)](https://github.com/jalik/js-observer/issues)\n![GitHub](https://img.shields.io/github/license/jalik/js-observer.svg)\n![npm](https://img.shields.io/npm/dt/@jalik/observer.svg)\n\nMake anything observable.\n\n## Introduction\n\nThe Observer design pattern is a well known pattern to create reactive applications.  \nYou can attach observers to a form text field, then when the text field value changes, all\nobservers are notified of that change and thus can do something in response.\n\n## Features\n\n* Add event listeners\n* Remove event listeners\n* Emit events with arguments passed to listeners\n* TypeScript declarations ♥\n\n## Sandbox\n\nPlay with the lib here:\nhttps://codesandbox.io/s/jalik-observer-demo-de16gw?file=/src/index.js\n\n## Installing\n\n```shell\nnpm i -P @jalik/observer\n```\n```shell\nyarn add @jalik/observer\n```\n\n## Adding an event listener\n\n```js\nimport { Observer } from '@jalik/observer'\n\nclass Person {\n  constructor (name) {\n    this.name = name\n    // Create the observer with current context\n    this.observer = new Observer(this)\n  }\n\n  on (event, observer) {\n    // Attach observer\n    this.observer.on(event, observer)\n  }\n\n  say (words) {\n    // Notify observers\n    this.observer.emit('say', words, new Date())\n  }\n}\n\nconst karl = new Person('karl')\n\nkarl.on('say', function (words, date) {\n  console.log(`${this.name} said: \"${words}\"`)\n})\n// this will show: karl said: \"hello\"\nkarl.say('hello')\n```\n\n## Removing an event listener\n\n```js\nimport { Observer } from '@jalik/observer'\n\nconst listener = function () {\n  console.log('double click detected')\n  // This avoid the current function to be called\n  // on the next \"doubleClick\" event notification.\n  observer.off('doubleClick', listener)\n}\n\nconst observer = new Observer()\nobserver.on('doubleClick', listener)\n\n// This will call the doubleClickListener once.\nobserver.emit('doubleClick')\n\n// This will not call the doubleClickListener\n// since it has been detached in the previous call.\nobserver.emit('doubleClick')\n```\n\n## Changelog\n\nHistory of releases is in the [changelog](./CHANGELOG.md).\n\n## License\n\nThe code is released under the [MIT License](http://www.opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjalik%2Fjs-observer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjalik%2Fjs-observer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjalik%2Fjs-observer/lists"}