rxjs
//Lecture 1
// var button = document.querySelector('button')
//button.addEventListener('click', () => {
// console.log(event)
// })
// Rx.Observable.fromEvent(button, 'click')
// .throttleTime(1000)
// .map((data) => {return data.clientY})
// .subscribe(
// (coordinate) => console.log(coordinate)
// )
//Lecture 2
// var observer = {
// next: function(value) {
// console.log(value)
// },
// error: function(error) {
// console.log(error)
// },
// complete: function() {
// console.log('Completed')
// }
// }
// Rx.Observable.fromEvent(button, 'click')
// var subscription = Rx.Observable.create(function(obs){
// obs.next('A Value')
// obs.error('Error')
// setTimeout(function(){
// obs.complete()
// obs.next('A second value')
// }, 2000)
// button.onclick = function(event){
// obs.next(event.clientX)
// }
// })
// .subscribe(observer)
// setTimeout(function() {
// subscription.unsubscribe()
// }, 2000
// Lecture 3
// var observable = Rx.Observable.interval(1000)
// var observer = {
// next: function(value) {
// console.log(value)
// }
// }
// observable.map(function(value) {
// return value * 2;
// }).throttleTime(2000)
// .subscribe(observer)
// Lecture 4
// var subject = new Rx.Subject()
// subject.subscribe({
// next: function(value) {
// console.log(value)
// }
// })
// subject.next('a new data')
// Lecture 5
// var observable = Rx.Observable.interval(1000)
// observable
// .filter(function(value){
// return value % 2 === 0
// }).subscribe({
// next: function(value){
// console.log(value)
// },
// error: function(error){
// console.log('error: ', error)
// }
// })
//Lecture 6
//var input = document.querySelector('input')
//var observable = Rx.Observable.fromEvent(input, 'input')
//observable
// .map(event => event.target.value)
// .debounceTime(500)
// .distinctUntilChanged()
// .subscribe({
// next: function(event) {
// console.log(event)
// }
//})
//Lecture 7
//var observable = Rx.Observable.of(1,2,3,4,5)
//observable
// .scan((total, currentValue) => {
// return total + currentValue;
// }, 0)
// .subscribe({
// next: function(value) {
// console.log(value)
// }
// })
// Lecture 8
//var input = document.querySelector('input')
//var observable = Rx.Observable.fromEvent(input, 'input')
//observable
// .pluck('target', 'value')
// .debounceTime(500)
// .distinctUntilChanged()
// .subscribe({
// next: function(value) {
// console.log(value)
// }
// })
//Lecture 9
//var input1 = document.querySelector('#input1')
//var input2 = document.querySelector('#input2')
//var span = document.querySelector('span')
//var obs1 = Rx.Observable.fromEvent(input1, 'input')
//var obs2 = Rx.Observable.fromEvent(input2, 'input')
//obs1.mergeMap(
// event1 => {
// return obs2.map(event2 => event1.target.value + ' ' + event2.target.value)
// }
//).subscribe(
// combinedValue => span.textContent = combinedValue
//)
// Lecture 10
//var button = document.querySelector('button')
//var obs1 = Rx.Observable.fromEvent(button, 'click')
//var obs2 = Rx.Observable.interval(1000)
//obs1.switchMap(
// event => {
// return obs2
// }
//).subscribe(
// value => console.log(value)
//)
//Lecture 11
var clickEmitted = new Rx.Subject();
var button = document.querySelector('button')
var div = document.querySelector('div')
button.addEventListener('click', () => clickEmitted.next('Clicked'))
clickEmitted.subscribe(
(value) => div.textContent = value
)
clickEmitted.next('Not Clicked')