Skip to content
This repository was archived by the owner on Oct 1, 2018. It is now read-only.

Commit a0fe792

Browse files
ashwin-sureshkumarashwin-sureshkumar
authored
Merge branch 'master' into docs-operator-mergemap
2 parents 895ccaa + 954eae8 commit a0fe792

File tree

3 files changed

+372
-6
lines changed

3 files changed

+372
-6
lines changed

‎src/operator-docs/transformation/bufferTime.ts

Lines changed: 171 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,175 @@
11
import { OperatorDoc } from '../operator.model';
22

33
export const bufferTime: OperatorDoc = {
4-
'name': 'bufferTime',
5-
'operatorType': 'transformation'
4+
name: 'bufferTime',
5+
operatorType: 'transformation',
6+
signature: `bufferTime(
7+
bufferTimeSpan: number,
8+
bufferCreationInterval: number,
9+
maxBufferSize: number,
10+
scheduler: Scheduler): Observable`,
11+
parameters: [
12+
{
13+
name: 'bufferTimeSpan',
14+
type: 'number',
15+
attribute: '',
16+
description: `The amount of time (in milliseconds) to fill each buffer array.`
17+
},
18+
{
19+
name: 'bufferCreationInterval',
20+
type: 'number',
21+
attribute: 'optional',
22+
description: `The interval (in milliseconds) at which to start new buffers.`
23+
},
24+
{
25+
name: 'maxBufferSize',
26+
type: 'number',
27+
attribute: 'optional',
28+
description: `The maximum amount of items per buffer.`
29+
},
30+
{
31+
name: 'scheduler',
32+
type: 'Scheduler',
33+
attribute: `optional
34+
default: async`,
35+
description: `The scheduler on which to schedule the intervals that determine buffer boundaries.`
36+
}
37+
],
38+
marbleUrl: 'http://reactivex.io/rxjs/img/bufferTime.png',
39+
shortDescription: {
40+
description: `Buffers the source Observable values for a specific time period.
41+
42+
<span class="informal">Collects values from the past as an array, and emits those arrays periodically in time.</span>`
43+
},
44+
walkthrough: {
45+
description: `
46+
Buffers values from the source for a specific time duration <span class="markdown-code">bufferTimeSpan</span>.
47+
It emits and resets the buffer every <span class="markdown-code">bufferTimeSpan</span> milliseconds,
48+
unless the optional argument <span class="markdown-code">bufferCreationInterval</span> is given.
49+
If <span class="markdown-code">bufferCreationInterval</span> is given,
50+
this operator emits the buffered values and re-opens the buffer every <span class="markdown-code">bufferCreationInterval</span>
51+
milliseconds and closes (no further values are buffered) the buffer every
52+
<span class="markdown-code">bufferTimeSpan</span> milliseconds.
53+
When the optional argument <span class="markdown-code">maxBufferSize</span> is specified,
54+
the buffer will be closed either after <span class="markdown-code">bufferTimeSpan</span> milliseconds
55+
or when it contains <span class="markdown-code">maxBufferSize</span> elements.`
56+
},
57+
examples: [
58+
{
59+
name:
60+
'After every two and a half seconds, emit an array of the click events during that timeframe',
61+
code: `
62+
import { fromEvent } from 'rxjs/observable/fromEvent';
63+
import { bufferTime } from 'rxjs/operators';
64+
65+
const clicks = fromEvent(document, 'click', e => ({x: e.clientX, y: e.clientY}));
66+
const buffered = clicks.pipe(
67+
bufferTime(2500)
68+
);
69+
buffered.subscribe(x => console.log(x));
70+
71+
/*
72+
Example console output
73+
74+
[]
75+
76+
[[object Object] {
77+
x: 150,
78+
y: 139
79+
}, [object Object] {
80+
x: 150,
81+
y: 139
82+
}, [object Object] {
83+
x: 150,
84+
y: 139
85+
}, [object Object] {
86+
x: 150,
87+
y: 139
88+
}]
89+
90+
[[object Object] {
91+
x: 150,
92+
y: 139
93+
}]
94+
95+
[[object Object] {
96+
x: 150,
97+
y: 137
98+
}, [object Object] {
99+
x: 150,
100+
y: 137
101+
}]
102+
103+
[]
104+
*/
105+
`,
106+
externalLink: {
107+
platform: 'JSBin',
108+
url: 'http://jsbin.com/fuqewiy/7/embed?js,console,output'
109+
}
110+
},
111+
{
112+
name:
113+
'Every five seconds, emit the click events from a window of the last two seconds',
114+
code: `
115+
import { fromEvent } from 'rxjs/observable/fromEvent';
116+
import { bufferTime } from 'rxjs/operators';
117+
118+
const clicks = fromEvent(document, 'click', e => ({x: e.clientX, y: e.clientY}));
119+
const buffered = clicks.pipe(
120+
bufferTime(2000, 5000)
121+
);
122+
buffered.subscribe(x => console.log(x));
123+
124+
/*
125+
Example console output:
126+
127+
[]
128+
129+
[]
130+
131+
[[object Object] {
132+
x: 159,
133+
y: 140
134+
}, [object Object] {
135+
x: 159,
136+
y: 140
137+
}]
138+
139+
[[object Object] {
140+
x: 161,
141+
y: 140
142+
}, [object Object] {
143+
x: 161,
144+
y: 140
145+
}, [object Object] {
146+
x: 161,
147+
y: 140
148+
}, [object Object] {
149+
x: 161,
150+
y: 140
151+
}, [object Object] {
152+
x: 161,
153+
y: 140
154+
}, [object Object] {
155+
x: 161,
156+
y: 140
157+
}]
158+
159+
[]
160+
*/
161+
`,
162+
externalLink: {
163+
platform: 'JSBin',
164+
url: 'http://jsbin.com/xohupot/6/embed?js,console,output'
165+
}
166+
}
167+
],
168+
relatedOperators: [
169+
'buffer',
170+
'bufferCount',
171+
'bufferToggle',
172+
'bufferWhen',
173+
'windowTime'
174+
]
6175
};

‎src/operator-docs/transformation/bufferToggle.ts

Lines changed: 142 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,146 @@
11
import { OperatorDoc } from '../operator.model';
22

33
export const bufferToggle: OperatorDoc = {
4-
'name': 'bufferToggle',
5-
'operatorType': 'transformation'
4+
name: 'bufferToggle',
5+
operatorType: 'transformation',
6+
signature: `bufferToggle(
7+
openings: SubscribableOrPromise,
8+
closingSelector: (value) => SubscribableOrPromise): Observable`,
9+
parameters: [
10+
{
11+
name: 'openings',
12+
type: 'SubscribableOrPromise',
13+
attribute: '',
14+
description: `A Subscribable or Promise of notifications to start new buffers.`
15+
},
16+
{
17+
name: 'closingSelector',
18+
type: '(value) => SubscribableOrPromise',
19+
attribute: '',
20+
description: `A function that takes the value emitted by the openings observable
21+
and returns a Subscribable or Promise, which, when it emits, signals that the associated buffer should be emitted and cleared.`
22+
}
23+
],
24+
marbleUrl: 'http://reactivex.io/rxjs/img/bufferToggle.png',
25+
shortDescription: {
26+
description: `
27+
Buffers the source Observable values starting from an emission from <span class="markdown-code">openings</span>
28+
and ending when the output of <span class="markdown-code">closingSelector</span> emits.
29+
<span class="informal">
30+
Collects values from the past as an array. Starts collecting only when <span class="markdown-code">openings</span> emits,
31+
and calls the <span class="markdown-code">closingSelector</span> function
32+
to get an Observable that tells when to close the buffer.</span>`
33+
},
34+
walkthrough: {
35+
description: `
36+
Buffers values from the source by opening the buffer via signals from an Observable
37+
provided to <span class="markdown-code">openings</span>,
38+
and closing and sending the buffers when a Subscribable or Promise
39+
returned by the <span class="markdown-code">closingSelector</span> function emits.
40+
`
41+
},
42+
examples: [
43+
{
44+
name: 'Every other second, emit the click events from the next 500ms',
45+
code: `
46+
import { fromEvent } from 'rxjs/observable/fromEvent';
47+
import { interval } from 'rxjs/observable/interval';
48+
import { empty } from 'rxjs/observable/empty';
49+
import { bufferToggle } from 'rxjs/operators';
50+
51+
const clicks = fromEvent(document, 'click', e => ({x: e.clientX, y: e.clientY}));
52+
const openings = interval(1000);
53+
const buffered = clicks.pipe(
54+
bufferToggle(openings, i => i % 2 ? interval(500) : empty())
55+
);
56+
buffered.subscribe(x => console.log(x));
57+
/*
58+
Expected console output:
59+
60+
[]
61+
62+
[[object Object] {
63+
x: 156,
64+
y: 165
65+
}, [object Object] {
66+
x: 156,
67+
y: 165
68+
}, [object Object] {
69+
x: 156,
70+
y: 165
71+
}]
72+
73+
[]
74+
75+
[]
76+
*/
77+
`,
78+
externalLink: {
79+
platform: 'JSBin',
80+
url: 'http://jsbin.com/nuriyod/6/embed?js,console,output'
81+
}
82+
},
83+
{
84+
name:
85+
'Start buffering all the click events when you press the "S" key and close the buffer when you press the "E" key',
86+
code: `
87+
import { fromEvent } from 'rxjs/observable/fromEvent';
88+
import { filter, bufferToggle } from 'rxjs/operators';
89+
90+
const clicks = fromEvent(document, 'click', e => ({x: e.clientX, y: e.clientY}));
91+
const keyUp = fromEvent(document,'keyup');
92+
const openings = keyUp.pipe(filter(e => e.key === 's'));
93+
const closing = keyUp.pipe(filter(e => e.key === 'e'));
94+
const buffered = clicks.pipe(
95+
bufferToggle(openings, _ => closing)
96+
);
97+
buffered.subscribe(x => console.log(x));
98+
99+
/*
100+
Expected console output:
101+
102+
[[object Object] {
103+
x: 147,
104+
y: 135
105+
}, [object Object] {
106+
x: 147,
107+
y: 135
108+
}, [object Object] {
109+
x: 144,
110+
y: 135
111+
}, [object Object] {
112+
x: 144,
113+
y: 135
114+
}, [object Object] {
115+
x: 144,
116+
y: 135
117+
}]
118+
119+
[[object Object] {
120+
x: 144,
121+
y: 135
122+
}, [object Object] {
123+
x: 144,
124+
y: 135
125+
}]
126+
127+
[[object Object] {
128+
x: 143,
129+
y: 136
130+
}]
131+
*/
132+
`,
133+
externalLink: {
134+
platform: 'JSBin',
135+
url: 'http://jsbin.com/vurobel/12/embed?js,console,output'
136+
}
137+
}
138+
],
139+
relatedOperators: [
140+
'buffer',
141+
'bufferCount',
142+
'bufferTime',
143+
'bufferWhen',
144+
'windowToggle'
145+
]
6146
};

‎src/operator-docs/utility/let.ts

Lines changed: 59 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,63 @@
11
import { OperatorDoc } from '../operator.model';
22

33
export const letOperator: OperatorDoc = {
4-
'name': 'let',
5-
'operatorType': 'utility'
4+
name: 'let',
5+
operatorType: 'utility',
6+
signature: 'public let(fun: function): Observable,',
7+
parameters: [
8+
{
9+
name: 'fun',
10+
type: 'function',
11+
attribute: '',
12+
description: `Selector function which can use the source sequence
13+
as many times as needed, without sharing subscriptions to the source sequence.`
14+
}
15+
],
16+
shortDescription: {
17+
description: `Returns an observable sequence that is the result of invoking the selector on the source sequence,
18+
without sharing subscriptions. This operator allows for a fluent style of writing queries that use the same
19+
sequence multiple times. There is an alias of letBind for browsers older than IE 9.`
20+
},
21+
additionalResources: [
22+
{
23+
url: 'https://www.learnrxjs.io/operators/utility/let.html',
24+
description: 'several examples of using the let operator',
25+
author: 'btroncone'
26+
}
27+
],
28+
examples: [
29+
{
30+
name: 'calls concat as part of a pipeline',
31+
code: `
32+
import { range } from 'rxjs/observable/range';
33+
34+
const obs = range(1, 3);
35+
36+
const source = obs.let((o) => o.concat(o));
37+
38+
const subscription = source.subscribe(
39+
(x) => {
40+
console.log('Next: ' + x);
41+
},
42+
(err) => {
43+
console.log('Error: ' + err);
44+
},
45+
() => {
46+
console.log('Completed');
47+
});
48+
49+
// => Next: 1
50+
// => Next: 2
51+
// => Next: 3
52+
// => Next: 1
53+
// => Next: 2
54+
// => Next: 3
55+
// => Completed
56+
`,
57+
externalLink: {
58+
platform: 'JSBin',
59+
url: 'http://jsbin.com/giwanupiqu/embed?html,js,console'
60+
}
61+
}
62+
]
663
};

0 commit comments

Comments
 (0)