Skip to content

Instantly share code, notes, and snippets.

@EloB

EloB/index.html

Created September 10, 2018 19:23
Show Gist options
  • Save EloB/4fa735ffeaf10ad25d3a4225c7937ce3 to your computer and use it in GitHub Desktop.
Save EloB/4fa735ffeaf10ad25d3a4225c7937ce3 to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source http://jsbin.com/xahomatafi
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser-polyfill.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="http://unpkg.com/rxjs@6.3.2/bundles/rxjs.umd.js"></script>
</head>
<body>
<script id="jsbin-javascript">
// noprotect
'use strict';
var _bind = Function.prototype.bind;
var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { var object = _x2, property = _x3, receiver = _x4; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
console.clear();
var _rxjs = rxjs;
var Observable = _rxjs.Observable;
var mergeMap = rxjs.operators.mergeMap;
var AbortController = window.AbortController || (function () {
function FakeAbortController() {
_classCallCheck(this, FakeAbortController);
this.signal = null;
}
_createClass(FakeAbortController, [{
key: 'abort',
value: function abort() {}
}]);
return FakeAbortController;
})();
var parseStream = function parseStream(source$, name) {
return new Observable(function (observer) {
var subscription = source$.subscribe(function (response) {
response[name]().then(function (value) {
return observer.next(value);
})['catch'](function (error) {
return observer.error(error);
});
});
return function () {
return subscription.unsubscribe();
};
});
};
var FetchStreamObservable = (function (_Observable) {
_inherits(FetchStreamObservable, _Observable);
function FetchStreamObservable() {
_classCallCheck(this, FetchStreamObservable);
_get(Object.getPrototypeOf(FetchStreamObservable.prototype), 'constructor', this).apply(this, arguments);
}
_createClass(FetchStreamObservable, [{
key: 'text',
value: function text() {
var _this = this;
for (var _len = arguments.length, options = Array(_len), _key = 0; _key < _len; _key++) {
options[_key] = arguments[_key];
}
return new Observable(function (observer) {
var textDecoder = new (_bind.apply(TextDecoder, [null].concat(options)))();
var subscription = _this.subscribe(function (value) {
return observer.next(textDecoder.decode(value));
}, function (error) {
return observer.error(error);
}, function () {
return observer.complete();
});
return function () {
return subscription.unsubscribe();
};
});
}
}]);
return FetchStreamObservable;
})(Observable);
var FetchObservable = (function (_Observable2) {
_inherits(FetchObservable, _Observable2);
function FetchObservable() {
_classCallCheck(this, FetchObservable);
_get(Object.getPrototypeOf(FetchObservable.prototype), 'constructor', this).apply(this, arguments);
}
_createClass(FetchObservable, [{
key: 'stream',
value: function stream() {
var _this2 = this;
return new FetchStreamObservable(function (observer) {
var subscription = _this2.subscribe(function callee$3$0(_ref) {
var body = _ref.body;
var reader, _ref2, done, value;
return regeneratorRuntime.async(function callee$3$0$(context$4$0) {
while (1) switch (context$4$0.prev = context$4$0.next) {
case 0:
if (body) {
context$4$0.next = 2;
break;
}
return context$4$0.abrupt('return', observer.error('Stream is not supported'));
case 2:
reader = body.getReader();
case 3:
if (!true) {
context$4$0.next = 14;
break;
}
context$4$0.next = 6;
return regeneratorRuntime.awrap(reader.read());
case 6:
_ref2 = context$4$0.sent;
done = _ref2.done;
value = _ref2.value;
if (!done) {
context$4$0.next = 11;
break;
}
return context$4$0.abrupt('break', 14);
case 11:
observer.next(value);
context$4$0.next = 3;
break;
case 14:
observer.complete();
reader.releaseLock();
case 16:
case 'end':
return context$4$0.stop();
}
}, null, _this2);
}, function (error) {
return observer.error(error);
});
return function () {
return subscription.unsubscribe();
};
});
}
}, {
key: 'json',
value: function json() {
return parseStream(this, 'json');
}
}, {
key: 'text',
value: function text() {
return parseStream(this, 'text');
}
}, {
key: 'arrayBuffer',
value: function arrayBuffer() {
return parseStream(this, 'arrayBuffer');
}
}, {
key: 'blob',
value: function blob() {
return parseStream(this, 'blob');
}
}]);
return FetchObservable;
})(Observable);
var fetch$ = function fetch$(url) {
var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
return new FetchObservable(function (observer) {
var controller = new AbortController();
var request = fetch(url, Object.assign({}, options, { signal: controller.signal }));
request.then(function (response) {
return observer.next(response);
})['catch'](function (error) {
return observer.error(error);
});
return function () {
return controller.abort();
};
});
};
fetch$('https://cors-anywhere.herokuapp.com/http://google.com/').stream().text().subscribe(console.log, console.error);
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser-polyfill.js"><\/script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="//unpkg.com/rxjs@6.3.2/bundles/rxjs.umd.js"><\/script>
</head>
<body>
</body>
</html></script>
<script id="jsbin-source-javascript" type="text/javascript">// noprotect
console.clear();
const { Observable } = rxjs;
const { mergeMap } = rxjs.operators;
const AbortController = window.AbortController || class FakeAbortController {
signal = null;
abort() {}
};
const parseStream = (source$, name) => new Observable((observer) => {
const subscription = source$
.subscribe((response) => {
response[name]()
.then(value => observer.next(value))
.catch(error => observer.error(error));
});
return () => subscription.unsubscribe();
});
class FetchStreamObservable extends Observable {
text(...options) {
return new Observable((observer) => {
const textDecoder = new TextDecoder(...options);
const subscription = this.subscribe(
value => observer.next(textDecoder.decode(value)),
error => observer.error(error),
() => observer.complete(),
);
return () => subscription.unsubscribe();
});
}
}
class FetchObservable extends Observable {
stream() {
return new FetchStreamObservable((observer) => {
const subscription = this.subscribe(
async ({ body }) => {
if (!body) return observer.error('Stream is not supported');
const reader = body.getReader();
while (true) {
const { done, value } = await reader.read();
if (done) break;
observer.next(value);
}
observer.complete();
reader.releaseLock();
},
error => observer.error(error),
);
return () => subscription.unsubscribe();
});
}
json() {
return parseStream(this, 'json');
}
text() {
return parseStream(this, 'text');
}
arrayBuffer() {
return parseStream(this, 'arrayBuffer');
}
blob() {
return parseStream(this, 'blob');
}
}
const fetch$ = (url, options = {}) => new FetchObservable((observer) => {
const controller = new AbortController();
const request = fetch(url, Object.assign({}, options, { signal: controller.signal }));
request
.then(response => observer.next(response))
.catch(error => observer.error(error));
return () => controller.abort();
});
fetch$('https://cors-anywhere.herokuapp.com/http://google.com/')
.stream()
.text()
.subscribe(
console.log,
console.error,
);</script></body>
</html>
Raw
jsbin.xahomatafi.js
// noprotect
'use strict';
var _bind = Function.prototype.bind;
var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { var object = _x2, property = _x3, receiver = _x4; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
console.clear();
var _rxjs = rxjs;
var Observable = _rxjs.Observable;
var mergeMap = rxjs.operators.mergeMap;
var AbortController = window.AbortController || (function () {
function FakeAbortController() {
_classCallCheck(this, FakeAbortController);
this.signal = null;
}
_createClass(FakeAbortController, [{
key: 'abort',
value: function abort() {}
}]);
return FakeAbortController;
})();
var parseStream = function parseStream(source$, name) {
return new Observable(function (observer) {
var subscription = source$.subscribe(function (response) {
response[name]().then(function (value) {
return observer.next(value);
})['catch'](function (error) {
return observer.error(error);
});
});
return function () {
return subscription.unsubscribe();
};
});
};
var FetchStreamObservable = (function (_Observable) {
_inherits(FetchStreamObservable, _Observable);
function FetchStreamObservable() {
_classCallCheck(this, FetchStreamObservable);
_get(Object.getPrototypeOf(FetchStreamObservable.prototype), 'constructor', this).apply(this, arguments);
}
_createClass(FetchStreamObservable, [{
key: 'text',
value: function text() {
var _this = this;
for (var _len = arguments.length, options = Array(_len), _key = 0; _key < _len; _key++) {
options[_key] = arguments[_key];
}
return new Observable(function (observer) {
var textDecoder = new (_bind.apply(TextDecoder, [null].concat(options)))();
var subscription = _this.subscribe(function (value) {
return observer.next(textDecoder.decode(value));
}, function (error) {
return observer.error(error);
}, function () {
return observer.complete();
});
return function () {
return subscription.unsubscribe();
};
});
}
}]);
return FetchStreamObservable;
})(Observable);
var FetchObservable = (function (_Observable2) {
_inherits(FetchObservable, _Observable2);
function FetchObservable() {
_classCallCheck(this, FetchObservable);
_get(Object.getPrototypeOf(FetchObservable.prototype), 'constructor', this).apply(this, arguments);
}
_createClass(FetchObservable, [{
key: 'stream',
value: function stream() {
var _this2 = this;
return new FetchStreamObservable(function (observer) {
var subscription = _this2.subscribe(function callee$3$0(_ref) {
var body = _ref.body;
var reader, _ref2, done, value;
return regeneratorRuntime.async(function callee$3$0$(context$4$0) {
while (1) switch (context$4$0.prev = context$4$0.next) {
case 0:
if (body) {
context$4$0.next = 2;
break;
}
return context$4$0.abrupt('return', observer.error('Stream is not supported'));
case 2:
reader = body.getReader();
case 3:
if (!true) {
context$4$0.next = 14;
break;
}
context$4$0.next = 6;
return regeneratorRuntime.awrap(reader.read());
case 6:
_ref2 = context$4$0.sent;
done = _ref2.done;
value = _ref2.value;
if (!done) {
context$4$0.next = 11;
break;
}
return context$4$0.abrupt('break', 14);
case 11:
observer.next(value);
context$4$0.next = 3;
break;
case 14:
observer.complete();
reader.releaseLock();
case 16:
case 'end':
return context$4$0.stop();
}
}, null, _this2);
}, function (error) {
return observer.error(error);
});
return function () {
return subscription.unsubscribe();
};
});
}
}, {
key: 'json',
value: function json() {
return parseStream(this, 'json');
}
}, {
key: 'text',
value: function text() {
return parseStream(this, 'text');
}
}, {
key: 'arrayBuffer',
value: function arrayBuffer() {
return parseStream(this, 'arrayBuffer');
}
}, {
key: 'blob',
value: function blob() {
return parseStream(this, 'blob');
}
}]);
return FetchObservable;
})(Observable);
var fetch$ = function fetch$(url) {
var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
return new FetchObservable(function (observer) {
var controller = new AbortController();
var request = fetch(url, Object.assign({}, options, { signal: controller.signal }));
request.then(function (response) {
return observer.next(response);
})['catch'](function (error) {
return observer.error(error);
});
return function () {
return controller.abort();
};
});
};
fetch$('https://cors-anywhere.herokuapp.com/http://google.com/').stream().text().subscribe(console.log, console.error);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment