Skip to content

Instantly share code, notes, and snippets.

View xiaoyunyang's full-sized avatar
🎯
Focusing

Xiaoyun Yang xiaoyunyang

🎯
Focusing
View GitHub Profile
@xiaoyunyang
xiaoyunyang / more-testable-code.js
Last active February 3, 2018 04:57
More Testable Code
// BETTER - more testable
const incrementedVal = (val) => val + 1
function substituteVal(val, low, high) {
if(val >= high) return high
else if(val <= low) return low
else return val
}
function shouldIncrement(val, disabled) {
return val >= 0 && val < 10 && !disabled
@xiaoyunyang
xiaoyunyang / HTML.js
Created March 8, 2018 07:10
isomorphic-router-demo/shared/components/HTML.js
// shared/components/HTML.js
import React from 'react';
const HTML = (props) => (
<html lang="en">
<head>
<title>Isomorphic Router Demo</title>
<link
rel="stylesheet"
@xiaoyunyang
xiaoyunyang / renderRoutes.js
Last active March 8, 2018 08:25
isomorphic-router-demo/iso-middleware/renderRoutes.js
// iso-middleware/renderRoutes.js
import React from 'react';
import { renderToString } from 'react-dom/server';
import { StaticRouter } from 'react-router-dom';
import { matchRoutes } from 'react-router-config';
import routes from '../shared/routes';
import HTML from '../shared/components/HTML';
import App from '../shared/App';
@xiaoyunyang
xiaoyunyang / matchParenTestCases.js
Created April 25, 2018 02:15
matchParenTestCases
let testCases = [
{test: '(', shouldBe: false},
{test: '())', shouldBe: false},
{test: null, shouldBe: false},
{test: undefined, shouldBe: false},
{test: 22, shouldBe: false},
{test: ')(', shouldBe: false},
{test: '', shouldBe: true},
{test: '()', shouldBe: true},
{test: '()()', shouldBe: true},
@xiaoyunyang
xiaoyunyang / matchParenTest.js
Created April 25, 2018 02:18
matchParenTest
const test = (fun testCases) => {
testCases.map(t => {
const shouldBe = t.shouldBe;
const is = fun(t.test);
const res = (shouldBe === is) ? 'passed' : 'failed';
const moreInfo = (res === 'failed') ? `testing ${t.test}. Should be ${shouldBe} but got ${is}` : ''
console.log(`${res} ${moreInfo}`);
})
}
@xiaoyunyang
xiaoyunyang / hasBalancedParen.js
Last active August 14, 2018 13:41
hasBalancedParen
// Parentheses Tally
const newOpenCnt = (c, openCnt) => {
if (c === '(') return openCnt + 1
if (c === ')') return openCnt - 1
return openCnt
}
function isBalanced(str, openCnt) {
// Continue or Stop?
if (typeof str !== 'string') return false
@xiaoyunyang
xiaoyunyang / PostEditor.js
Last active August 15, 2018 19:54
Draftjs Component With A Few Plugins
import React from 'react';
import PropTypes from 'prop-types';
import {
convertToRaw,
EditorState,
RichUtils
} from 'draft-js';
import Editor from 'draft-js-plugins-editor';
import createMarkdownPlugin from 'draft-js-markdown-plugin';
import createInlineToolbarPlugin, { Separator } from 'draft-js-inline-toolbar-plugin';
package main
import (
"math/rand"
"os"
svg "github.com/ajstarks/svgo"
)
var (

css-grid-flowchart

The visualization component takes as inputs

  • matrix - A N x M matrix where N is the number of columns and M is the number of rows. Each element of the matrix specifies the i of building block to render.
  • workflowVisData - A datastructure that represents the graph of all the workflow steps with information on how they are connected and the distance between the node and the root of the graph (assumed to be a directed acyclic graph (DAG)).

matrix is created from workflowVisData as follows:

  1. Initialize a N x M matrix. N is longest path in the DAG (workflowStepOrder is pre-calculated for each node in the graph which provides the path of the node from the root node). M is calculated from the largest frequency of workflowStepOrder. matrix is initialized with empty.