Skip to content

Instantly share code, notes, and snippets.

@lozandier

lozandier/index.html

Created April 19, 2015 23:39
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save lozandier/204436fe9aa748e97c78 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save lozandier/204436fe9aa748e97c78 to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source http://jsbin.com/micija/2
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
Name: <input id="name">
Age: <input id="age">
<button id="button">Save me</button>
<script id="jsbin-javascript">
"use strict";
var button = document.getElementById("button");
function Observable(forEach) {
this._forEach = forEach;
}
Observable.prototype = {
forEach: function (onNext, onError, onCompleted) {
// are they passing in functions
if (typeof onNext === "function") {
return this._forEach({
onNext: onNext,
onError: onError || function () {},
onCompleted: onCompleted || function () {}
});
} else {
// are they passing an Observer
return this._forEach(onNext);
}
},
map: function (projectionFunction) {
var self = this;
// mapped observable
return new Observable(function forEach(observer) {
return self.forEach(function onNext(x) {
observer.onNext(projectionFunction(x));
}, function onError(e) {
observer.onError(e);
}, function onCompleted() {
observer.onCompleted();
});
});
},
filter: function (testFunction) {
var self = this;
// filtered observable
return new Observable(function forEach(observer) {
return self.forEach(function onNext(x) {
if (testFunction(x)) {
observer.onNext(x);
}
}, function onError(e) {
observer.onError(e);
}, function onCompleted() {
observer.onCompleted();
});
});
},
take: function (num) {
var self = this;
// take observable
return new Observable(function forEach(observer) {
var counter = 0,
subscription = self.forEach(function onNext(v) {
observer.onNext(v);
counter++;
if (counter === num) {
observer.onCompleted();
subscription.dispose();
}
}, function onError(e) {
observer.onError(e);
}, function onCompleted() {
observer.onCompleted();
});
return subscription;
});
}
};
Observable.fromEvent = function (dom, eventName) {
return new Observable(function forEach(observer) {
var handler = function (e) {
return observer.onNext(e);
};
dom.addEventListener(eventName, handler);
// Subscription
return {
dispose: function () {
dom.removeEventListener(eventName, handler);
}
};
});
};
Observable.fromObservations = function (obj) {
return new Observable(function forEach(observer) {
var handler = function (e) {
return observer.onNext(e);
};
Object.observe(obj, handler);
// Subscription
return {
dispose: function () {
Object.unobserve(obj, handler);
}
};
});
};
/*
var clicks =
Observable.
fromEvent(button, "click").
filter(e => e.pageX > 40).
map(e => e.pageX + "px");
*/
var person = { name: "Jim" };
Observable.fromObservations(person).forEach(function (changes) {
console.log(changes);
});
person.name = "Don";
person.age = 23;
</script>
<script id="jsbin-source-javascript" type="text/javascript">var button = document.getElementById('button');
function Observable(forEach) {
this._forEach = forEach;
}
Observable.prototype = {
forEach: function(onNext, onError, onCompleted) {
// are they passing in functions
if (typeof onNext === "function") {
return this._forEach({
onNext: onNext,
onError: onError || function() {},
onCompleted: onCompleted || function() {}
});
}
else {
// are they passing an Observer
return this._forEach(onNext);
}
},
map: function(projectionFunction) {
var self = this;
// mapped observable
return new Observable(function forEach(observer) {
return self.forEach(
function onNext(x) { observer.onNext(projectionFunction(x)); },
function onError(e) { observer.onError(e); },
function onCompleted() { observer.onCompleted(); });
});
},
filter: function(testFunction) {
var self = this;
// filtered observable
return new Observable(function forEach(observer) {
return self.forEach(
function onNext(x) {
if (testFunction(x)) {
observer.onNext(x);
}
},
function onError(e) { observer.onError(e); },
function onCompleted() { observer.onCompleted(); });
});
},
take: function(num) {
var self = this;
// take observable
return new Observable(function forEach(observer) {
var counter = 0,
subscription = self.forEach(
function onNext(v) {
observer.onNext(v);
counter++;
if (counter === num) {
observer.onCompleted();
subscription.dispose();
}
},
function onError(e) {
observer.onError(e);
},
function onCompleted() {
observer.onCompleted();
});
return subscription;
});
}
};
Observable.fromEvent = function(dom, eventName) {
return new Observable(function forEach(observer) {
var handler = (e) => observer.onNext(e);
dom.addEventListener(eventName, handler);
// Subscription
return {
dispose: () => {
dom.removeEventListener(eventName, handler);
}
};
});
};
Observable.fromObservations = function(obj) {
return new Observable(function forEach(observer) {
var handler = (e) => observer.onNext(e);
Object.observe(obj, handler);
// Subscription
return {
dispose: () => {
Object.unobserve(obj, handler);
}
};
});
};
/*
var clicks =
Observable.
fromEvent(button, "click").
filter(e => e.pageX > 40).
map(e => e.pageX + "px");
*/
var person = { name: 'Jim'};
Observable.
fromObservations(person).
forEach(changes => {
console.log(changes);
});
person.name = "Don";
person.age = 23;
</script></body>
</html>
Raw
jsbin.micija.js
"use strict";
var button = document.getElementById("button");
function Observable(forEach) {
this._forEach = forEach;
}
Observable.prototype = {
forEach: function (onNext, onError, onCompleted) {
// are they passing in functions
if (typeof onNext === "function") {
return this._forEach({
onNext: onNext,
onError: onError || function () {},
onCompleted: onCompleted || function () {}
});
} else {
// are they passing an Observer
return this._forEach(onNext);
}
},
map: function (projectionFunction) {
var self = this;
// mapped observable
return new Observable(function forEach(observer) {
return self.forEach(function onNext(x) {
observer.onNext(projectionFunction(x));
}, function onError(e) {
observer.onError(e);
}, function onCompleted() {
observer.onCompleted();
});
});
},
filter: function (testFunction) {
var self = this;
// filtered observable
return new Observable(function forEach(observer) {
return self.forEach(function onNext(x) {
if (testFunction(x)) {
observer.onNext(x);
}
}, function onError(e) {
observer.onError(e);
}, function onCompleted() {
observer.onCompleted();
});
});
},
take: function (num) {
var self = this;
// take observable
return new Observable(function forEach(observer) {
var counter = 0,
subscription = self.forEach(function onNext(v) {
observer.onNext(v);
counter++;
if (counter === num) {
observer.onCompleted();
subscription.dispose();
}
}, function onError(e) {
observer.onError(e);
}, function onCompleted() {
observer.onCompleted();
});
return subscription;
});
}
};
Observable.fromEvent = function (dom, eventName) {
return new Observable(function forEach(observer) {
var handler = function (e) {
return observer.onNext(e);
};
dom.addEventListener(eventName, handler);
// Subscription
return {
dispose: function () {
dom.removeEventListener(eventName, handler);
}
};
});
};
Observable.fromObservations = function (obj) {
return new Observable(function forEach(observer) {
var handler = function (e) {
return observer.onNext(e);
};
Object.observe(obj, handler);
// Subscription
return {
dispose: function () {
Object.unobserve(obj, handler);
}
};
});
};
/*
var clicks =
Observable.
fromEvent(button, "click").
filter(e => e.pageX > 40).
map(e => e.pageX + "px");
*/
var person = { name: "Jim" };
Observable.fromObservations(person).forEach(function (changes) {
console.log(changes);
});
person.name = "Don";
person.age = 23;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment