Skip to content

Commit 0bfb343

Browse files
committed
image: triangle and fix place-iamges/align
1 parent 43db594 commit 0bfb343

2 files changed

Lines changed: 49 additions & 3 deletions

File tree

racketscript-extras/racketscript/htdp/image.rkt

Lines changed: 47 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,10 @@
1717

1818
line
1919
rectangle
20+
square
2021
circle
2122
text
23+
triangle
2224

2325
place-image
2426
place-images
@@ -242,6 +244,37 @@
242244
radius radius ;; radius-x, radius-y
243245
0 0 (twice #js.Math.PI)))))])
244246

247+
(define-proto Polygon
248+
#:init
249+
(λ (vertices mode pen-or-color)
250+
(define xs (map posn-x vertices))
251+
(define ys (map posn-y vertices))
252+
253+
(define width (- (apply max xs) (apply min xs)))
254+
(define height (- (apply max ys) (apply min xs)))
255+
256+
(set-object! #js*.this
257+
[type "polygon"]
258+
[vertices vertices]
259+
[width width]
260+
[height height]
261+
[mode mode]
262+
[pen pen-or-color]))
263+
#:prototype-fields
264+
[render
265+
(λ (ctx x y)
266+
(define first-point (car #js*.this.vertices))
267+
(define rest-points (cdr #js*.this.vertices))
268+
(define radius #js*.this.radius)
269+
(with-origin ctx [x y]
270+
(with-path ctx {#js*.this.mode #js*.this.pen}
271+
(#js.ctx.moveTo (posn-x first-point) (posn-y first-point))
272+
(let loop ([points rest-points])
273+
(unless (null? points)
274+
(define pt (car points))
275+
(#js.ctx.lineTo (posn-x pt) (posn-y pt))
276+
(loop (cdr points)))))))])
277+
245278
(define (empty-scene width height)
246279
(new (EmptyScene width height #f)))
247280

@@ -262,9 +295,20 @@
262295
(define (rectangle w h m p)
263296
(new (Rectangle w h m p)))
264297

298+
(define (square s m p)
299+
(new (Rectangle s s m p)))
300+
265301
(define (circle r m p)
266302
(new (Circle r m p)))
267303

304+
(define (triangle side mode color)
305+
;; height = side * sin(45)
306+
(define height (* side (/ (sqrt 3) 2)))
307+
(new (Polygon (list (posn (- (/ side 2)) (/ height 2))
308+
(posn 0 (- (/ height 2)))
309+
(posn (/ side 2) (/ height 2)))
310+
mode
311+
color)))
268312

269313
;;-----------------------------------------------------------------------------
270314
;; Combine images
@@ -301,7 +345,7 @@
301345
;; Center of image is (0, 0), which is also center of bigger
302346
;; image. Calculate the distance of centers of images from this
303347
;; final center.
304-
;;
348+
;;
305349
;; When given an xy offset, we start by placing each image on top
306350
;; of each other. We line up the images at upper-right corner of
307351
;; new canvas to start with and then translate the appropriate
@@ -510,12 +554,12 @@
510554
(define new-x
511555
(case x-place
512556
[("left") (+ (half #js.image.width) x)]
513-
[("right") (- (half #js.image.width) x)]
557+
[("right") (- x (half #js.image.width))]
514558
[("center" "middle") x]))
515559
(define new-y
516560
(case y-place
517561
[("top") (+ (half #js.image.height) y)]
518-
[("bottom") (- (half #js.image.height) y)]
562+
[("bottom") (- y (half #js.image.height))]
519563
[("center" "middle") y]))
520564
(posn new-x new-y))
521565

racketscript-extras/racketscript/private/jscommon.rkt

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
cos
2020
floor
2121
abs+ceil
22+
sqrt
2223
max
2324
min
2425
twice
@@ -77,6 +78,7 @@
7778
(define abs+ceil (λ (n) (#js.Math.abs (#js.Math.ceil n))))
7879
(define max #js.Math.max)
7980
(define min #js.Math.min)
81+
(define sqrt #js.Math.sqrt)
8082

8183
(define-syntax-rule (twice e)
8284
(* e 2))

0 commit comments

Comments
 (0)