Skip to content

niklas-wortmann/rxjs-web

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

42 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

RxJS Web Logo

rxjs-web
Observables for the Browser API

NPM Bundlephobia MIT license


This library aims to provide Observable based APIs, that wrap Web APIs.


⚠️ A word of warning:

Some of the Web APIs covered here are experimental, non-standard, and/or not well-supported. If necessary, polyfills need to be provided by the user of this library.

The public API surface of this library can be affected by breaking changes within the experimental API used.

Additionally, the implementation of this library makes use of globalThis which breaks ie <= 11! There is no plan to add support for IE 11 in this library.

πŸ“¦ Install

rxjs-web is available via npm:

npm i rxjs-web

N.B.: This library relies on RxJS >= 6 and expects you already have it installed in your project.

πŸ”§ API Reference

General hint: usually promise-based APIs are eager, while Observable-based APIs of this library are lazy (executed/started upon subscription). This design decision was made due to the general specification of RxJS Observables.

fromIntersectionObserver

πŸ“– IntersectionObserver | πŸ”¬ experimental

...

fromMutationObserver

πŸ“– MutationObserver

...

fromPerformanceObserver

πŸ“– PerformanceObserver | πŸ”¬ experimental

...

fromResizeObserver

πŸ“– ResizeObserver | πŸ”¬ experimental

...

fromImport

πŸ“– dynamic import

...

fromMediaListQuery

πŸ“– matchMedia

...

fromNetwork

πŸ“– Network Information API | πŸ”¬ experimental

...

fromPermission

πŸ“– Permission API | πŸ”¬ experimental

...

fromPosition

πŸ“– Geolocation API

...

fromSensor

πŸ“– Sensor APIs | πŸ”¬ experimental

...

speak (Text to Speech)

πŸ“– SpeechSynthesis | πŸ”¬ not well tested

speak provides handy interface for chaining and aborting synthesis.

Usage

import { speak } from 'rxjs-web';

speak('Hello!').subscribe();

Chained

import { speak } from 'rxjs-web';

concat(
    speak('Hello, mom!'),
    speak('How are you?'),
    speak('I miss you.'),
).subscribe();

Advanced usage

import { of, merge, concat, timer } from 'rxjs';
import { map, takeUntil } from 'rxjs/operators';
import { speak, SpeechSynthesisUtteranceConfig } from 'rxjs-web';

const a: string = 'Hello, mom!';

const b: SpeechSynthesisUtteranceConfig = {
  text: 'How are you?',
  lang: 'en-UK',
  pitch: 1,
  rate: 1,
  volume: 1,
};

const c = new SpeechSynthesisUtterance('I miss you');
c.rate = 1;
c.lang = 'en-US';
c.pitch = 1;
c.rate = 1;
c.volume = 1;

concat(speak(a), speak(b), speak(c)).subscribe((e: SpeechSynthesisEvent) => {
  console.log(e.name);
  console.log(e.type);
});

listen (Speech to Text)

πŸ“– SpeechRecognition | πŸ”¬ not well tested

Handy interface for continuous speech recognition.

simple example

import { listen } from 'rxjs-web';

listen({ lang: 'en' })
  .subscribe(e => {
    if (e.type == 'result') {
      console.log(e.results[0][0].transcript);
    }
  });

πŸ›Έ Not yet supported APIs

These APIs are not yet supported by this library, and might be included later:

Name / Link
Vibration API
Bluetooth API
File and Directory Entries API
Image Capture API
Push API
Broadcast Channel API

🀝 Want to contribute to this project?

That will be awesome!

Please create an issue before submitting a PR β€” we'll be able to discuss it first!

Thanks!

Credits

This project is build upon the typescript library starter. Kudos to @alexjoverm and every contributor of this amazing project!

Many thanks also goes to Sascha for creating this fantastic logo!

Enjoy πŸ™‚

About

Observable based Api wrapping Web APIs

Resources

License

Code of conduct

Stars

Watchers

Forks

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •