glre 0.26.0 → 0.28.0

package/src/node/node.ts

@@ -1,100 +1,51 @@
-import { OPERATORS, FUNCTIONS, SWIZZLES } from './const'
-import { is } from '../utils/helpers'
-import type { NodeType } from './const'
-import type { Node, ProxyCallback, X } from './types'
-
-let nodeIdCounter = 0
-
-// ノードIDを生成
-const generateNodeId = () => `node_${++nodeIdCounter}`
-
-// ノードを作成
-export const createNode = (type: NodeType, value?: any, options?: Partial<Node>): Node => {
-        return {
-                id: generateNodeId(),
-                type,
-                value,
-                children: [],
-                ...options,
+import { code } from './code'
+import { assign, toVar, toConst } from './scope'
+import { getId, isConversion, isFunction, isOperator, isSwizzle } from './utils'
+import type { Functions, NodeProps, NodeProxy, NodeTypes, Operators, Swizzles, X } from './types'
+
+const toPrimitive = (x: X) => {
+        return (hint: string) => {
+                if (hint === 'string') return code(x)
         }
 }
 
-const isSwizzleProperty = (key = '') => SWIZZLES.includes(key as any)
-const isOperatorMethod = (key = '') => OPERATORS.includes(key as any)
-const isMathMethod = (key = '') => FUNCTIONS.includes(key as any)
-
-// Proxyハンドラーを作成
-const createNodeProxy = (node: Node, callback?: (info: ProxyCallback) => X) => {
-        const get = (_target: unknown, key: unknown) => {
-                if (!is.str(key) || key === 'then') return void 0
-
-                if (key === 'id') return node.id
-                if (key === 'type') return node.type
-                if (key === 'value') return node.value
-                if (key === 'property') return node.property
-
-                // swizzle prooerty
-                if (isSwizzleProperty(key))
-                        return createNodeProxy(
-                                createNode(getSwizzleType(key), undefined, {
-                                        parent: node,
-                                        property: key,
-                                }),
-                                callback
-                        )
-
-                // 演算子メソッド
-                if (isOperatorMethod(key))
-                        return (...args: any[]) => {
-                                return createNodeProxy(
-                                        createNode(node.type, undefined, {
-                                                operator: key as any,
-                                                children: [node, ...args],
-                                        }),
-                                        callback
-                                )
-                        }
-
-                // 数学関数メソッド
-                if (isMathMethod(key))
-                        return (...args: any[]) => {
-                                return createNodeProxy(
-                                        createNode(getMathReturnType(key, node.type), undefined, {
-                                                mathFunction: key as any,
-                                                children: [node, ...args],
-                                        }),
-                                        callback
-                                )
+export const node = (type: NodeTypes, props?: NodeProps | null, ...args: X[]) => {
+        if (!props) props = {}
+        if (args.length) props.children = args
+        const x = new Proxy(() => {}, {
+                get(_, key) {
+                        if (key === 'type') return type
+                        if (key === 'props') return props
+                        if (key === 'toVar') return toVar(x)
+                        if (key === 'toConst') return toConst(x)
+                        if (key === 'assign') return assign(x)
+                        if (key === 'isProxy') return true
+                        if (key === 'toString') return code.bind(null, x)
+                        if (key === Symbol.toPrimitive) return toPrimitive(x)
+                        if (isSwizzle(key)) return s(key, x)
+                        if (isOperator(key)) return (...y: X[]) => o(key, x, ...y)
+                        if (isFunction(key)) return (...y: X[]) => f(key, x, ...y)
+                        if (isConversion(key)) return n(key, x)
+                },
+                set(_, key, value) {
+                        if (isSwizzle(key)) {
+                                s(key, x).assign(value)
+                                return true
                         }
-
-                return callback?.({ path: [key], args: [] })
-        }
-        const apply = (_target: unknown, _thisArg: unknown, args: any) => {
-                return callback?.({ path: [], args })
-        }
-
-        return new Proxy(() => {}, { get, apply }) as X
+                        return false
+                },
+        }) as unknown as NodeProxy
+        return x
 }
 
-// スウィズルの戻り値型を取得
-const getSwizzleType = (swizzle: string): NodeType => {
-        if (swizzle.length === 1) return 'float'
-        if (swizzle.length === 2) return 'vec2'
-        if (swizzle.length === 3) return 'vec3'
-        if (swizzle.length === 4) return 'vec4'
-        return 'float'
-}
+// Node shorthands
+export const v = (...args: X[]) => node('variable', { id: getId() }, ...args)
+export const s = (key: Swizzles, arg: X) => node('swizzle', null, key, arg)
+export const n = (key: string, ...args: X[]) => node('conversions', null, key, ...args)
+export const o = (key: Operators, ...args: X[]) => node('operator', null, key, ...args)
+export const f = (key: Functions, ...args: X[]) => node('math_fun', null, key, ...args)
 
-// 数学関数の戻り値型を取得
-const getMathReturnType = (func: string, inputType: NodeType): NodeType => {
-        if (func === 'length') return 'float'
-        if (func === 'normalize') return inputType
-        if (func === 'toVar') return inputType
-        return inputType
-}
+// uniform and attribute
+export const u = (id: string, value?: number | number[] | boolean) => node('uniform', { id, value })
 
-// 公開API
-export const node = (type: NodeType, value?: any, options?: Partial<Node>) => {
-        const nodeInstance = createNode(type, value, options)
-        return createNodeProxy(nodeInstance)
-}
+export const select = (x: X, y: X, z: X) => node('ternary', null, x, y, z)

package/src/node/scope.ts

@@ -0,0 +1,121 @@
+import { infer } from './infer'
+import { node } from './node'
+import { getId } from './utils'
+import type { NodeProxy, X } from './types'
+
+let _scope: NodeProxy | null = null
+
+const scoped = (x: NodeProxy | null, callback = () => {}) => {
+        const prev = _scope
+        _scope = x
+        callback()
+        _scope = prev
+}
+
+const addToScope = (x: NodeProxy) => {
+        if (!_scope) return // ignore
+        if (!_scope.props.children) _scope.props.children = []
+        _scope.props.children.push(x)
+}
+
+export const If = (condition: X, callback: () => void) => {
+        const scope = node('scope')
+        scoped(scope, callback)
+        const ifNode = node('if', null, condition, scope)
+        addToScope(ifNode)
+        const createChain = () => ({
+                ElseIf: (newCondition: X, elseIfCallback: () => void) => {
+                        const elseIfScope = node('scope')
+                        scoped(elseIfScope, elseIfCallback)
+                        ifNode.props.children!.push(newCondition, elseIfScope)
+                        return createChain()
+                },
+                Else: (elseCallback: () => void) => {
+                        const elseScope = node('scope')
+                        scoped(elseScope, elseCallback)
+                        ifNode.props.children!.push(elseScope)
+                },
+        })
+        return createChain()
+}
+
+export const Loop = (x: X, callback?: (params: { i: NodeProxy }) => void) => {
+        const y = node('scope')
+        scoped(y, () => callback?.({ i: node('variable', { id: 'i' }) }))
+        const ret = node('loop', null, x, y)
+        addToScope(ret)
+        return ret
+}
+
+export const Switch = (value: X) => {
+        const switchNode = node('switch', null, value)
+        addToScope(switchNode)
+        const createChain = () => ({
+                Case: (...values: X[]) => {
+                        return (callback: () => void) => {
+                                const caseScope = node('scope')
+                                scoped(caseScope, callback)
+                                const caseNode = node('case', null, ...values, caseScope)
+                                switchNode.props.children!.push(caseNode)
+                                return createChain()
+                        }
+                },
+                Default: (callback: () => void) => {
+                        const defaultScope = node('scope')
+                        scoped(defaultScope, callback)
+                        const defaultNode = node('default', null, defaultScope)
+                        switchNode.props.children!.push(defaultNode)
+                },
+        })
+
+        return createChain()
+}
+
+export const Fn = (callback: (args: NodeProxy[]) => NodeProxy) => {
+        const id = getId()
+        return (...args: NodeProxy[]) => {
+                const x = node('scope')
+                let y: NodeProxy | undefined
+                const paramVars: NodeProxy[] = []
+                for (let i = 0; i < args.length; i++) {
+                        const paramId = `p${i}`
+                        const paramVar = node('variable', { id: paramId })
+                        paramVars.push(paramVar)
+                }
+                scoped(x, () => (y = callback(paramVars)))
+                const returnType = y ? infer(y) : 'void'
+                const paramInfo = args.map((arg, i) => ({ name: `p${i}`, type: infer(arg) }))
+                const def = node('fn_def', { id, returnType, paramInfo, args }, x, y)
+                return node('fn_run', { id, returnType }, def, ...paramVars)
+        }
+}
+
+export const toVar = (x: X) => (id?: string) => {
+        if (!id) id = getId()
+        const y = node('variable', { id })
+        const z = node('declare', null, y, x)
+        addToScope(z)
+        return y
+}
+
+export const toConst = (x: X) => (id?: string) => {
+        if (!id) id = getId()
+        const y = node('constant', { id })
+        const z = node('declare', null, y, x)
+        addToScope(z)
+        return y
+}
+
+export const assign = (x: X) => (y: X) => {
+        const assignNode = node('assign', null, x, y)
+        addToScope(assignNode)
+        return x
+}
+
+export const varying = (value: X, name?: string) => {
+        if (!name) name = getId()
+        const varyingVar = node('varying', { id: name })
+        const declaration = node('declare', null, varyingVar, value)
+        addToScope(declaration)
+        return varyingVar
+}

package/src/node/types.ts

@@ -1,101 +1,135 @@
-import type { NodeType, Operator, MathFunction, Swillzes } from './const'
+import { CONSTANTS, CONVERSIONS, FUNCTIONS, OPERATOR_KEYS } from './const'
 
-// ノードの基本インターフェース
-export interface Node {
-        id: string
-        type: NodeType
-        value?: any
-        property?: string
-        parent?: Node
-        children?: Node[]
-        operator?: Operator
-        mathFunction?: MathFunction
-}
+export type Constants = (typeof CONSTANTS)[number] | 'void'
 
-// Proxyハンドラーのコールバック型
-export interface ProxyCallback {
-        path: string[]
-        args: any[]
-}
+export type Conversions = (typeof CONVERSIONS)[number]
+
+export type Functions = (typeof FUNCTIONS)[number]
 
-// ノード作成関数の型
-export type NodeCreator = (value?: any) => X
+export type Operators = (typeof OPERATOR_KEYS)[number]
 
-// 演算子メソッドの型
-export interface OperatorMethods {
-        add(x: X | number): X
-        sub(x: X | number): X
-        mul(x: X | number): X
-        div(x: X | number): X
-        mod(x: X | number): X
-        equal(x: X | number): X
-        notEqual(x: X | number): X
-        lessThan(x: X | number): X
-        lessThanEqual(x: X | number): X
-        greaterThan(x: X | number): X
-        greaterThanEqual(x: X | number): X
-        and(x: X): X
-        or(x: X): X
-        not(): X
+export interface NodeProps {
+        id?: string
+        args?: X[]
+        type?: string
+        children?: X[]
+        returnType?: Constants
+        value?: number | number[] | boolean
+        paramInfo?: Array<{ name: string; type: string }>
 }
 
-// 数学関数メソッドの型
-export interface MathMethods {
-        abs(): X
-        acos(): X
-        asin(): X
-        atan(): X
-        ceil(): X
-        cos(): X
-        floor(): X
-        fract(): X
-        length(): X
-        normalize(): X
-        sin(): X
-        sqrt(): X
-        tan(): X
-        toVar(): X
+export interface NodeConfig {
+        isWebGL?: boolean
+        uniforms?: Set<string>
+        functions?: Set<string>
+        onUniform?: (name: string, value: any) => void
 }
 
-// 全てのswizzleパターンをまとめる型
+type _Swizzles<T extends string> = T | `${T}${T}` | `${T}${T}${T}` | `${T}${T}${T}${T}`
 
-// スウィズルプロパティの型
-export type SwizzleProperties = {
-        [k in Swillzes]: X
-}
+export type Swizzles =
+        | _Swizzles<'x' | 'y' | 'z' | 'w'>
+        | _Swizzles<'r' | 'g' | 'b' | 'a'>
+        | _Swizzles<'p' | 'q'>
+        | _Swizzles<'s' | 't'>
 
-// ノードProxy型
-export interface X extends MathMethods, OperatorMethods, SwizzleProperties {
-        readonly id: string
-        readonly type: NodeType
-        readonly value: any
-        readonly property: string
-        (...args: any[]): X
-}
+export type NodeTypes =
+        | 'uniform'
+        | 'variable'
+        | 'swizzle'
+        | 'operator'
+        | 'conversions'
+        | 'math_fun'
+        | 'declare'
+        | 'assign'
+        | 'fn_def'
+        | 'fn_run'
+        | 'if'
+        | 'loop'
+        | 'scope'
+        | 'switch'
+        | 'case'
+        | 'default'
+        | 'ternary'
+        | 'attribute'
+        | 'varying'
+        | 'builtin'
+        | 'constant'
+        | 'vertex_stage'
 
-// ユニフォーム変数の型
-export interface UniformNode extends X {
-        set(value: any): void
-        onObjectUpdate(callback: (context: any) => any): UniformNode
-        onRenderUpdate(callback: (context: any) => any): UniformNode
-}
+export interface NodeProxy extends Record<Swizzles | Conversions, NodeProxy> {
+        // Operators
+        add(n: X): NodeProxy
+        sub(n: X): NodeProxy
+        mul(n: X): NodeProxy
+        div(n: X): NodeProxy
+        mod(n: X): NodeProxy
+        equal(n: X): NodeProxy
+        notEqual(n: X): NodeProxy
+        lessThan(n: X): NodeProxy
+        lessThanEqual(n: X): NodeProxy
+        greaterThan(n: X): NodeProxy
+        greaterThanEqual(n: X): NodeProxy
+        and(n: X): NodeProxy
+        or(n: X): NodeProxy
+        not(): NodeProxy
 
-// 関数定義の型
-export interface FunctionNode {
-        (...args: any[]): X
-        call(x: X[]): X
-}
+        // Variable manipulation
+        assign(n: X): NodeProxy
+        toVar(name?: string): NodeProxy
+        toConst(name?: string): NodeProxy
 
-// 条件分岐の型
-export interface ConditionalNode {
-        ElseIf(condition: X, callback: () => void): ConditionalNode
-        Else(callback: () => void): void
-}
+        // Math function methods
+        abs(): NodeProxy
+        sin(): NodeProxy
+        cos(): NodeProxy
+        tan(): NodeProxy
+        asin(): NodeProxy
+        acos(): NodeProxy
+        atan(): NodeProxy
+        atan2(x: X): NodeProxy
+        pow(y: X): NodeProxy
+        pow2(): NodeProxy
+        pow3(): NodeProxy
+        pow4(): NodeProxy
+        sqrt(): NodeProxy
+        inverseSqrt(): NodeProxy
+        exp(): NodeProxy
+        exp2(): NodeProxy
+        log(): NodeProxy
+        log2(): NodeProxy
+        floor(): NodeProxy
+        ceil(): NodeProxy
+        round(): NodeProxy
+        fract(): NodeProxy
+        trunc(): NodeProxy
+        min(y: X): NodeProxy
+        max(y: X): NodeProxy
+        clamp(min: X, max: X): NodeProxy
+        saturate(): NodeProxy
+        mix(y: X, a: X): NodeProxy
+        step(edge: X): NodeProxy
+        smoothstep(edge0: X, edge1: X): NodeProxy
+        length(): NodeProxy
+        distance(y: X): NodeProxy
+        dot(y: X): NodeProxy
+        cross(y: X): NodeProxy
+        normalize(): NodeProxy
+        reflect(N: X): NodeProxy
+        refract(N: X, eta: X): NodeProxy
+        sign(): NodeProxy
+        oneMinus(): NodeProxy
+        reciprocal(): NodeProxy
+        negate(): NodeProxy
+        dFdx(): NodeProxy
+        dFdy(): NodeProxy
+        fwidth(): NodeProxy
 
-// WebGL/WebGPU変換コンテキスト
-export interface ConversionContext {
-        target: 'webgl' | 'webgpu'
-        nodes: Map<string, Node>
-        variables: Map<string, string>
-        functions: Map<string, string>
+        // System properties
+        toString(c?: NodeConfig): string
+        type: NodeTypes
+        props: NodeProps
+        isProxy: true
 }
+
+export type X = NodeProxy | number | string | boolean | null | undefined

package/src/node/utils.ts

@@ -0,0 +1,95 @@
+import { is } from '../utils/helpers'
+import { code } from './code'
+import { CONVERSIONS, FUNCTIONS, OPERATOR_KEYS, OPERATORS, TYPE_MAPPING } from './const'
+import type { Conversions, Functions, NodeConfig, NodeProxy, Operators, Swizzles, X } from './types'
+
+export const isSwizzle = (key: unknown): key is Swizzles => {
+        return is.str(key) && /^[xyzwrgbastpq]{1,4}$/.test(key)
+}
+
+export const isOperator = (key: unknown): key is Operators => {
+        return OPERATOR_KEYS.includes(key as Operators)
+}
+
+export const isFunction = (key: unknown): key is Functions => {
+        return FUNCTIONS.includes(key as Functions)
+}
+
+export const isConversion = (key: unknown): key is Conversions => {
+        return CONVERSIONS.includes(key as Conversions)
+}
+
+export const isNodeProxy = (x: unknown): x is NodeProxy => {
+        if (!x) return false
+        if (!is.fun(x)) return false // @ts-ignore
+        return x.isProxy
+}
+
+let count = 0
+
+export const hex2rgb = (hex: number) => {
+        const r = ((hex >> 16) & 0xff) / 255
+        const g = ((hex >> 8) & 0xff) / 255
+        const b = (hex & 0xff) / 255
+        return [r, g, b]
+}
+
+export const getId = () => `i${count++}`
+
+export const joins = (children: X[], c: NodeConfig) => {
+        return children
+                .filter((x) => !is.und(x) && !is.nul(x))
+                .map((x) => code(x, c))
+                .join(', ')
+}
+
+export const formatConversions = (x: X, c?: NodeConfig) => {
+        if (!is.str(x)) return ''
+        if (c?.isWebGL) return x
+        return TYPE_MAPPING[x as keyof typeof TYPE_MAPPING]
+}
+
+export const getOperator = (op: X) => {
+        return OPERATORS[op as keyof typeof OPERATORS] || op
+}
+
+const generateHead = (c: NodeConfig) => {
+        const uniforms = Array.from(c.uniforms!)
+                .map((uniform, i) => {
+                        if (c.isWebGL) return `uniform ${uniform};`
+                        else return `@group(0) @binding(${i}) var<uniform> ${uniform};`
+                })
+                .join('\n')
+        const functions = Array.from(c.functions!).join('\n')
+        return `${uniforms}\n${functions}`
+}
+
+const generateFragmentMain = (body: string, head: string, isWebGL = true) => {
+        if (isWebGL)
+                return `
+#version 300 es
+precision mediump float;
+out vec4 fragColor;
+${head}
+void main() {
+fragColor = ${body};
+}`.trim()
+        return `
+${head}
+@fragment
+fn main(@builtin(position) position: vec4f) -> @location(0) vec4f {
+return ${body};
+}`.trim()
+}
+
+export const fragment = (x: X, c: NodeConfig) => {
+        const body = code(x, c)
+        const head = generateHead(c)
+        return generateFragmentMain(body, head, c.isWebGL)
+}
+
+export const vertex = (x: X, c: NodeConfig) => {
+        const body = code(x, c)
+        const head = generateHead(c)
+        return generateFragmentMain(body, head, c.isWebGL)
+}

package/src/utils/pipeline.ts

@@ -1,5 +1,4 @@
-import { wgsl } from '../code/wgsl'
-import { X } from '../node'
+import { fragment, vertex, X } from '../node'
 import { is } from './helpers'
 import type { GPUContext, GPUDevice, GPUPipeline } from '../types'
 
@@ -21,7 +20,7 @@ fn main(@builtin(position) position: vec4f) -> @location(0) vec4f {
 }
 `
 
-export const createDevive = async (c: GPUContext) => {
+export const createDevice = async (c: GPUContext) => {
         const gpu = (navigator as any).gpu
         const format = gpu.getPreferredCanvasFormat()
         const adapter = await gpu.requestAdapter()
@@ -38,8 +37,8 @@ export const createPipeline = (
         vs: string | X = defaultVertexWGSL,
         fs: string | X = defaultFragmentWGSL
 ) => {
-        if (is.obj(fs)) fs = wgsl(fs)
-        if (is.obj(vs)) vs = wgsl(vs)
+        if (!is.str(fs)) fs = fragment(fs, { isWebGL: false })
+        if (!is.str(vs)) vs = vertex(vs, { isWebGL: false })
         const layout = device.createPipelineLayout({ bindGroupLayouts })
         return device.createRenderPipeline({
                 vertex: {

package/src/utils/program.ts

@@ -1,5 +1,4 @@
-import { glsl } from '../code/glsl'
-import { X } from '../node'
+import { fragment, vertex, X } from '../node'
 import { is } from './helpers'
 
 export const defaultVertexGLSL = /* cpp */ `
@@ -29,24 +28,29 @@ const createShader = (c: WebGLRenderingContext, source: string, type: number) =>
         if (c.getShaderParameter(shader, c.COMPILE_STATUS)) return shader
         const error = c.getShaderInfoLog(shader)
         c.deleteShader(shader)
-        throw new Error(`Could not compile shader: ${error}`)
+        console.warn(`Could not compile shader: ${error}`)
 }
 
 export const createProgram = (
         c: WebGLRenderingContext,
         vs: string | X = defaultVertexGLSL,
-        fs: string | X = defaultFragmentGLSL
+        fs: string | X = defaultFragmentGLSL,
+        onError = () => {}
 ) => {
-        if (is.obj(fs)) fs = glsl(fs as X)
-        if (is.obj(vs)) vs = glsl(vs as X)
+        if (!is.str(fs)) fs = fragment(fs, { isWebGL: true })
+        if (!is.str(vs)) vs = vertex(fs, { isWebGL: true })
         const pg = c.createProgram()
-        c.attachShader(pg, createShader(c, vs, c.VERTEX_SHADER))
-        c.attachShader(pg, createShader(c, fs, c.FRAGMENT_SHADER))
+        const _vs = createShader(c, vs, c.VERTEX_SHADER)
+        const _fs = createShader(c, fs, c.FRAGMENT_SHADER)
+        if (!_vs || !_fs) return onError()
+        c.attachShader(pg, _vs)
+        c.attachShader(pg, _fs)
         c.linkProgram(pg)
         if (c.getProgramParameter(pg, c.LINK_STATUS)) return pg
         const error = c.getProgramInfoLog(pg)
         c.deleteProgram(pg)
-        throw new Error(`Could not link pg: ${error}`)
+        onError()
+        console.warn(`Could not link pg: ${error}`)
 }
 
 export const createVbo = (c: WebGLRenderingContext, data: number[]) => {

package/src/webgl.ts

@@ -5,7 +5,7 @@ import type { GL, WebGLState } from './types'
 
 export const webgl = async (gl: Partial<GL>) => {
         const c = gl.el!.getContext('webgl2')!
-        const pg = createProgram(c, gl.vs, gl.fs)
+        const pg = createProgram(c, gl.vs, gl.fs, () => void (gl.isLoop = false))!
         const state = { context: c, program: pg } as WebGLState
         c.useProgram(pg)