;;;; SUMMARY
;; An attractive color table for buttons using NetLogo colors
;;;; COPYRIGHT
;; Copyright (C) 2006 James P. Steiner
;; Some Rights Reserved
;;
;;
to startup
   setup
end   

to setup
   ca
   
   ask patches with [ pxcor = screen-edge-x ]
   [ ifelse py2pc >= 0 
     [  
     set pcolor py2pc

     set plabel-color-of patch-at -2 0 black
     set plabel-of patch-at  -2 0 (word  hexcolor ( pcolor + 3 ) "  " )
     ask patches at-points [ [-2 0][-3 0] [-4 0 ]] [ set pcolor pcolor-of myself + 3 ]

     set plabel-of patch-at  -6 0 (word  hexcolor ( pcolor + 0 ) "  " )
     ask patches at-points [ [-6 0][-7 0][-8 0]] [ set pcolor pcolor-of myself + 0 ]
   
     set plabel-of patch-at  -10 0 (word  hexcolor ( pcolor - 3 ) "  " )
     ask patches at-points [ [-10 0][-11 0] [-12 0]] [ set pcolor pcolor-of myself - 3 ]
     
     set plabel-of patch-at -13 0 (word (color-name pcolor) " " (int pcolor) ":" )
     set pcolor-of patch (- screen-edge-x) pycor pcolor
     ]
     [ if pycor = screen-edge-y
       [ set plabel-of patch-at -2 0  "Highlight(+3)"
         set plabel-of patch-at -6 0  "Normal        "
         set plabel-of patch-at -10 0 "Shadow(-3)  "
       ]
     ]
   ]
    
end

to go
   if mouse-down?
   [ ask patches with [ round mouse-ycor = pycor and pxcor = 0 and py2pc >= 0 ]
     [ let c py2pc
       clear-output
       output-print (word "a._____     /* " (color-name c) " */" )
       output-print (word "{ color: " (hexcolor ( c + 3 ) ) " ;   background: " (hexcolor ( c      ) )" ;"  " }" )
       output-print (word "a:hover._____     /* reversed " (color-name c) " */" )
       output-print (word "{ color: " (hexcolor ( c - 3 ) ) " ;   background: " (hexcolor ( c + 2  ) )" ; }" )
       output-print ""        
     ]
     wait .25 
   ]
end
   
to-report py2pc
   ;; convert a pycor to a color
   let c (screen-size-y - (pycor + screen-edge-y) - 2) * 10 + 5
   ifelse c >= 0 and c < 140
   [ report c ]
   [ report -1 ]
end

to-report color-name [ c ]
   let clist [ "gray" "red" "orange" "brown" "yellow" "green" "lime" "turquoise" "cyan" "sky" "blue" "violet" "magenta" "pink" ]
   report (item int((c - 5) / 10) clist)
end   

   
to color-table-rgb
    ;; quick conversion of the set of netlogo colors
    ;; to their 3-byte decimal RGB equivalent
    clear-output
    output-print "NetLogo Colors as 1-byte  RGB"
    foreach (n-values 14 [ (? * 10) + 5])
    [ let as-decimal (map [ precision (? * 256) 0 ] extract-rgb ? ) 
      let as-hex (map [ dec2hex ? ] as-decimal )
      output-print (word as-hex " " as-decimal " ;; " (color-name ?) )
    ]
    
end

to-report dec2hex [ d ]
   let a d mod 16
   let b int ((d - a ) / 16)
   let hex [ "0" "1" "2" "3" "4" "5" "6" "7" "8" "9" "A" "B" "C" "D" "E" "F" ]   
   report (word (item b hex) (item a hex))
end

to-report rgb2hex [ rgb-list ]
   let a "#"
   foreach rgb-list
   [ let b ? * 256
     let h dec2hex b
     set a (word a h)
   ]
   ;; ;; one-command version, using "reduce"
   ;; set a reduce [ (word ?1 (dec2hex ( ?2 * 256 ))) ] (fput "" rgb-list)
   report a
end

to-report hexcolor [ c ]
   report (rgb2hex extract-rgb c)
end
  
@#$#@#$#@
GRAPHICS-WINDOW
10
50
394
411
8
7
22.0
1
12
1
1
1
0
0
0
1

CC-WINDOW
5
425
750
520
Command Center
0

BUTTON
684
10
739
43
reset
setup
NIL
1
T
OBSERVER
T
NIL

BUTTON
12
10
67
43
NIL
go
T
1
T
OBSERVER
T
NIL

TEXTBOX
72
18
466
36
Click "go", then click a row to see sample CSS code for using these colors.

OUTPUT
397
50
741
336

BUTTON
489
10
659
43
display RGB values table
color-table-rgb
NIL
1
T
OBSERVER
T
NIL

@#$#@#$#@
INFORMATION
-----------
Aside from producing a color chart, this model contains code to report a name for a color number, and code to convert number from 0 - 256 to hexidecimal 00 to FF.

This model was used to determine the 3-byte RGB color codes needed to color the buttons on the turtle-zero web site, so the turtlezero color scheme coordinates with the colors available in NetLogo models.


@#$#@#$#@
default
true
0
Polygon -7500403 true true 150 5 40 250 150 205 260 250

circle
false
0
Circle -7500403 true true 0 0 300

cylinder
false
0
Circle -7500403 true true 0 0 300

dot
false
0
Circle -7500403 true true 90 90 120

face happy
false
0
Circle -7500403 true true 8 8 285
Circle -16777216 true false 60 75 60
Circle -16777216 true false 180 75 60
Polygon -16777216 true false 150 255 90 239 62 213 47 191 67 179 90 203 109 218 150 225 192 218 210 203 227 181 251 194 236 217 212 240

face neutral
false
0
Circle -7500403 true true 8 7 285
Circle -16777216 true false 60 75 60
Circle -16777216 true false 180 75 60
Rectangle -16777216 true false 60 195 240 225

face sad
false
0
Circle -7500403 true true 8 8 285
Circle -16777216 true false 60 75 60
Circle -16777216 true false 180 75 60
Polygon -16777216 true false 150 168 90 184 62 210 47 232 67 244 90 220 109 205 150 198 192 205 210 220 227 242 251 229 236 206 212 183

line
true
0
Line -7500403 true 150 0 150 300

line half
true
0
Line -7500403 true 150 0 150 150

square
false
0
Rectangle -7500403 true true 30 30 270 270

x
false
0
Polygon -7500403 true true 270 75 225 30 30 225 75 270
Polygon -7500403 true true 30 75 75 30 270 225 225 270

@#$#@#$#@
NetLogo 3.0.2
@#$#@#$#@
@#$#@#$#@
@#$#@#$#@
@#$#@#$#@