Skip to content

Instantly share code, notes, and snippets.

View xiaoyunyang's full-sized avatar
🎯
Focusing

Xiaoyun Yang xiaoyunyang

🎯
Focusing
199 followers · 60 following
View GitHub Profile
@xiaoyunyang
xiaoyunyang / stringTruncation.md
Last active February 20, 2024 04:57
String Truncation Algorithm

Naive

const TRUNCATE_WORDS_CUTOFF = 12;

export const truncateName = (name: string, truncateCutoff: number = TRUNCATE_WORDS_CUTOFF) =>
    name.length > truncateCutoff
        ? `${name.substring(0, truncateCutoff)}...`
        : name;
@xiaoyunyang
xiaoyunyang / css-grid-flowchart-readme.md
Last active May 24, 2019 20:09

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.
@xiaoyunyang
xiaoyunyang / TypeScriptResources.md
Last active March 16, 2019 23:50
Typescript talks and articles
@xiaoyunyang
xiaoyunyang / svgo-spiral.go
Created February 4, 2019 02:38
package main
import (
"math/rand"
"os"
svg "github.com/ajstarks/svgo"
)
var (
@xiaoyunyang
xiaoyunyang / PostDisplay.js
Last active January 9, 2023 15:16
Use Draft.js to display rich text created using the Draft.js editor.
import React from 'react';
import PropTypes from 'prop-types';
import { CompositeDecorator, convertFromRaw, Editor, EditorState } from 'draft-js';
// Following code based on:
// https://github.com/facebook/draft-js/blob/master/examples/draft-0-10-0/link/link.html
const Link = (props) => {
const {url} = props.contentState.getEntity(props.entityKey).getData();
return (
<a rel="nofollow noreferrer" href={url} target="_blank">
@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';
@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 / 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 / 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 / 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"