steveruizok

// A big collection of vector utilities. Collected into a class to improve logging / packaging.

/* ----------------- Start Copy Here ---------------- */

export default class Vec {
  /**
   * Clamp a value into a range.
   * @param n
   * @param min
   */

steveruizok

import { FC } from 'react'
import { useCodeMirror } from './useCodeMirror'

interface Props {
  content: string
  classNames?: string
  onContentChange: (content: string) => void
}

export const CodeMirror: FC<Props> = ({

steveruizok

// Run this code on tldraw.com
// By @steveruizok
// Based on an awesome image by @cacheflowe: https://twitter.com/cacheflowe/status/1408902719130288130

new NumberControl({
  label: 'radius',
  value: 200,
  min: 50,
  max: 500,
})

steveruizok

function fillRectangleWithLines(
  shape: Rectangle,
  gap: number,
  messiness = 0.5
) {
  const { size } = shape

  const rng = Utils.rng(shape.shape.id)

  const gapX = size[0] / (Math.floor((size[0] - gap) / gap) / 2)

steveruizok

/**
 * Get the intersection of two rays, with origin points p0 and p1, and direction vectors n0 and n1.
 * @param p0 The origin point of the first ray
 * @param n0 The direction vector of the first ray
 * @param p1 The origin point of the second ray
 * @param n1 The direction vector of the second ray
 * @returns
 */
export function getRaysIntersection(
  p0: number[],

steveruizok

/**
 * Find the closest point on a SVG path to an off-path point.
 * @param pathNode
 * @param point
 * @returns
 */
export function getClosestPointOnSVGPath(
  pathNode: SVGPathElement,
  point: number[]
): {

steveruizok

/**
 * Copy a string to the clipboard.
 * @param string 
 */
export function copyToClipboard(string: string): boolean {
  let textarea: HTMLTextAreaElement
  let result: boolean

  try {

steveruizok

/**
 * Get balanced dash-strokearray and dash-strokeoffset properties for a path of a given length.
 * @param length The length of the path.
 * @param strokeWidth The shape's stroke-width property.
 * @param style The stroke's style: "dashed" or "dotted" (default "dashed").
 * @param snap An interval for dashes (e.g. 4 will produce arrays with 4, 8, 16, etc dashes).
 */
export function getPerfectDashProps(
  length: number,

steveruizok

/**
 * A function that will return whether the given user is sponsoring you.
 * Requires a personal access token from GitHub.
 * See https://docs.github.com/en/github/authenticating-to-github/keeping-your-account-and-data-secure/creating-a-personal-access-token
 *
 * @param userA The sponsoring user.
 */
async function isUserSponsoringMe(username: string) {
  const res = await fetch('https://api.github.com/graphql', {
    method: 'POST',

steveruizok

/**
 * Seeded random number generator, using [xorshift](https://en.wikipedia.org/wiki/Xorshift).
 * Adapted from [seedrandom](https://github.com/davidbau/seedrandom).
 * @param seed {string} The seed for random numbers.
 */
function rng(seed = '') {
  let x = 0
  let y = 0
  let z = 0
  let w = 0