/**
 * Adapted from https://github.com/purescript-contrib/purescript-drawing/blob/master/test/Main.purs
 */ import { error } from 'fp-ts/lib/Console' ; import * as IO from 'fp-ts/lib/IO' ; import * as M from 'fp-ts/lib/Monoid' ; import * as O from 'fp-ts/lib/Option' ; import * as RA from 'fp-ts/lib/ReadonlyArray' ; import { flow } from 'fp-ts/lib/function' ; import { pipe } from 'fp-ts/lib/pipeable' ; import * as Color from '../src/Color' ; import * as C from '../src/Canvas' ; import * as D from '../src/Drawing' ; import * as S from '../src/Shape' ; const CANVAS_ONE_ID = 'canvas1' ; const CANVAS_TWO_ID = 'canvas2' ; const SCALE = 0.375 ; const closedPath = S . closed ( RA . readonlyArray ) ; const colors = [ Color . hsla ( 60 , 0.6 , 0.5 , 1 ) , Color . hsla ( 55 , 0.65 , 0.55 , 1 ) , Color . hsla ( 30 , 1 , 0.55 , 1 ) , Color . hsla ( 345 , 0.62 , 0.45 , 1 ) , Color . hsla ( 305 , 0.7 , 0.28 , 1 ) , Color . hsla ( 268 , 1 , 0.18 , 1 ) , Color . hsla ( 240 , 1 , 0.01 , 1 ) ] ; const pentagon = pipe ( RA . range ( 0 , 5 ) , RA . map ( ( n ) => { const theta = ( Math . PI / 2.5 ) * n ; return S . point ( Math . sin ( theta ) , Math . cos ( theta ) ) ; } ) , closedPath ) ; const makeDrawing = ( n ) : D . Drawing => { if ( n === 0 ) { return D . monoidDrawing . empty ; } const first = D . fill ( pentagon , D . fillStyle ( colors [ n ] ) ) ; const next = D . scale ( SCALE , SCALE , makeDrawing ( n - 1 ) ) ; const drawings = RA . cons ( first , pipe ( RA . range ( 0 , 4 ) , RA . map ( ( n ) => D . rotate ( ( Math . PI / 2.5 ) * ( n + 0.5 ) , D . translate ( 0 , Math . cos ( Math . PI / 5 ) * ( 1 + SCALE ) , next ) ) ) ) ) ; return M . fold ( D . monoidDrawing ) ( drawings ) ; } ; const snowflake = D . render ( D . withShadow ( M . fold ( D . monoidShadow ) ( [ D . shadowColor ( Color . black ) , D . shadowBlur ( 10 ) ] ) , D . translate ( 300 , 300 , D . scale ( 150 , 150 , makeDrawing ( 6 ) ) ) ) ) ; console . time ( 'snowflake' ) ; C . renderTo ( CANVAS_ONE_ID , ( ) => error ( `[ERROR]: Unable to find canvas with id ${ CANVAS_ONE_ID }` ) ) ( snowflake ) ( ) ; console . timeEnd ( 'snowflake' ) ; /**
 * Example of a clipped canvas from [MDN Web Docs](https://mzl.la/3e0mKKx).
 */ const clippedRect = D . render ( D . clipped ( S . circle ( 100 , 75 , 50 ) , D . many ( [ D . fill ( S . rect ( 0 , 0 , 300 , 150 ) , D . fillStyle ( Color . hsl ( 240 , 1 , 0.5 ) ) ) , D . fill ( S . rect ( 0 , 0 , 100 , 100 ) , D . fillStyle ( Color . hsl ( 0 , 1 , 0.5 ) ) ) ] ) ) ) ; console . time ( 'clippedRect' ) ; C . renderTo ( CANVAS_TWO_ID , ( ) => error ( `[ERROR]: Unable to find canvas with id ${ CANVAS_TWO_ID }` ) ) ( clippedRect ) ( ) ; console . timeEnd ( 'clippedRect' ) ;