Skip to content

Instantly share code, notes, and snippets.

@mikeyoon

mikeyoon/index.html

Last active April 5, 2018 22:16
Show Gist options
  • Save mikeyoon/58ac81358758aae9142a1a646d3c55b5 to your computer and use it in GitHub Desktop.
Save mikeyoon/58ac81358758aae9142a1a646d3c55b5 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Bad Cold Example">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.8/Rx.min.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
</head>
<body>
<button onclick="subscribe()">Subscribe Keypress</button>
<button onclick="unsubscribe()">Unsubscribe Keypress</button>
<button onclick="clearResults()">Clear</button>
<ul id="output">
</ul>
<script type="text/javascript">
var $output = $('#output');
</script>
<script id="jsbin-javascript">
let obs = new Rx.Observable(observer => {
let handler = (event) => {
observer.next(event.key);
};
$output.append('<li>Adding Event Listener</li>');
document.addEventListener('keypress', handler);
return () => {
document.removeEventListener('keypress', handler);
$output.append('<li>complete</li>');
};
});
let subs = [];
function subscribe() {
let id = subs.length + 1;
subs.push({
id: id,
sub: obs.subscribe(
res => $output.append('<li>' + res + ' pressed</li>'),
err => $output.append('<li>cold ' + err + '</li>'),
() => $output.append('<li>cold closed</li>')
)
});
}
function unsubscribe() {
subs.forEach(x => {
x.sub.unsubscribe();
});
subs = [];
}
function clearResults() {
$output.html('');
}
</script>
<script id="jsbin-source-javascript" type="text/javascript">let obs = new Rx.Observable(observer => {
let handler = (event) => {
observer.next(event.key);
};
$output.append('<li>Adding Event Listener</li>');
document.addEventListener('keypress', handler);
return () => {
document.removeEventListener('keypress', handler);
$output.append('<li>complete</li>');
};
});
let subs = [];
function subscribe() {
let id = subs.length + 1;
subs.push({
id: id,
sub: obs.subscribe(
res => $output.append('<li>' + res + ' pressed</li>'),
err => $output.append('<li>cold ' + err + '</li>'),
() => $output.append('<li>cold closed</li>')
)
});
}
function unsubscribe() {
subs.forEach(x => {
x.sub.unsubscribe();
});
subs = [];
}
function clearResults() {
$output.html('');
}</script></body>
</html>
Raw
jsbin.lilunuz.js
let obs = new Rx.Observable(observer => {
let handler = (event) => {
observer.next(event.key);
};
$output.append('<li>Adding Event Listener</li>');
document.addEventListener('keypress', handler);
return () => {
document.removeEventListener('keypress', handler);
$output.append('<li>complete</li>');
};
});
let subs = [];
function subscribe() {
let id = subs.length + 1;
subs.push({
id: id,
sub: obs.subscribe(
res => $output.append('<li>' + res + ' pressed</li>'),
err => $output.append('<li>cold ' + err + '</li>'),
() => $output.append('<li>cold closed</li>')
)
});
}
function unsubscribe() {
subs.forEach(x => {
x.sub.unsubscribe();
});
subs = [];
}
function clearResults() {
$output.html('');
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment