adrianmcli

{
  "parser": "babel-eslint",
  "env": {
    "browser": true,
    "node": true,
    "es6": true
  },
  "ecmaFeatures": {
    "modules": true,
    "jsx": true

adrianmcli

{"keys": ["tab"], "command": "expand_abbreviation_by_tab", "context":
  [
    { "operand": "source.js", "operator": "equal", "match_all": true, "key": "selector" },
    { "match_all": true, "key": "selection_empty" },
    { "operator": "equal", "operand": false, "match_all": true, "key": "has_next_field" },
    { "operand": false, "operator": "equal", "match_all": true, "key": "auto_complete_visible" },
    { "match_all": true, "key": "is_abbreviation" }
  ]
}

adrianmcli

/*** Hot Stream ***/
// there is only "one real" invocation of the stream
const count$ = Rx.Observable.interval(1000).share();

count$.subscribe(x => console.log('A' + x));

setTimeout(() => {
  count$.subscribe(x => console.log('    B' + x));
}, 2000);

adrianmcli

import React from 'react';
import Rx from 'rxjs/Rx';
import { observeComponent, fromComponent } from 'observe-component/rxjs';

// Create the component with the listeners we want
const TextArea = observeComponent('onInput')('textarea');

export default class MyComponent extends React.Component {
  constructor() {
    super();

adrianmcli

/*** Helper Functions ***/

const showTyping = () => $('.typing').text('User is typing...');
const showIdle = () => $('.typing').text('');
const updateTimer = (x) => $('.timer').text(x);

/*** Program Logic ***/

// declare shared streams
const inputEvents$ = Rx.Observable.fromEvent($('#input'), 'input').share();

adrianmcli

/*** Helper Functions ***/

const showTyping = () => $('.typing').text('User is typing...');
const showIdle = () => $('.typing').text('');
const updateTimer = (x) => $('.timer').text(x);
const handleTypingStateChange = state =>
  state === 1 ? showTyping() : showIdle();

/*** Program Logic ***/

adrianmcli

var a = "hey";
var cb = function() { console.log(a); }

setTimeout(cb, 1000);

// let's make a delay of 3 seconds
var timestamp = Date.now() + 3000;
while (Date.now() < timestamp);

// now that 3 seconds have passed,

adrianmcli

// UI Event Streams --------------------------------------------
const refreshButton = document.querySelector('.refresh');
const closeButton1 = document.querySelector('.close1');
const closeButton2 = document.querySelector('.close2');
const closeButton3 = document.querySelector('.close3');

const refreshClickStream = Rx.Observable.fromEvent(refreshButton, 'click');
const close1ClickStream = Rx.Observable.fromEvent(closeButton1, 'click');
const close2ClickStream = Rx.Observable.fromEvent(closeButton2, 'click');
const close3ClickStream = Rx.Observable.fromEvent(closeButton3, 'click');

adrianmcli

var async = true;
var xhr = new XMLHttpRequest();
xhr.open('get', 'data.json', async);
xhr.send();

// Create a three second delay (don't do this in real life)
var timestamp = Date.now() + 3000;
while (Date.now() < timestamp);

// Now that three seconds have passed,

adrianmcli

import React, { Component } from 'react';

class IsTyping extends Component {
  constructor() {
    super();
    this.state = {
      typing: false,
    };
    this.timeout = null;
    this.onChange = this.onChange.bind(this);