Arnaud Rinquin ArnaudRinquin

Peristream

A wrapper around periscope.tv event streams, allowing you to easilly access them

Usage

npm i -S peristream

periscope-stats

Store and prepare periscope statistics from live periscope.tv info streams.

Usage

The first step is to get some data from a periscope PUBNUB stream. The easiest way probably is to use peristream. The following examples uses peristream.

Usage: envtojson [indent]

EDIT: I created the package ¯\_(ツ)_/¯

What's interesting to note on this not so trivial example (we have variants -> className; base style attrs that can be expended)

comprehensive img props types + automatically passed
auto extra classNames (& style) merging
auto ref forwarding, if need be

It's debatable that writing such component is simpler than the classic approach but the outcome is undoubtly better.

There are also nice ways to handle variants and such.

	// This one is more or less what you could do in angular 2
	import { getUsers } from './userAPI';
	import { Component } from 'angular2';

	@Component({
	template: '<pre>{{this.users}}</pre>'
	});
	export class UserList {
	constructor() {
	// for sake of example only, don't call APIs in constructors

	apiVersion: v1
	kind: Service
	metadata:
	name: {{ template "mongo-arbiter-name" . }}
	labels:
	name: {{ template "mongo-arbiter-name" . }}
	spec:
	ports:
	- port: 27017
	selector:

	componentDidMount() {
	this.el.addEventListener('copy', this.onCopy)
	}

	onCopy = (event) => {
	const { editorState } = this.props
	const contentState = editorState.getCurrentContent()
	const html = convertToHTML(contentState);
	console.log('converted!', html);
	// TODO put reulst in the clipboard

	import { Component } from 'react'
	import { connect } from 'react-redux'

	class MapWrapper extends Component {
	render() {
	const mapProps = 123 // todo
	return <LeafletMap ref={(mapEl) => this.mapEl = mapEl} {...mapProps} />
	}
	componentDidMount() {
	const { markerData } = this.props

	atom-text-editor {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	font-family: "Operator Mono";
	font-weight: 500;
	}

	atom-text-editor.editor {
	.syntax--storage.syntax--type.syntax--function.syntax--arrow,
	.syntax--keyword.syntax--operator:not(.accessor),