toggle-button & spin-box demo

tog-button.red

	find red-lang interpreter/compiler for many popular OS http://www.red-lang.org
	
	welcome any suggestions, comments or complaints about the code or anything else.
	note: new gui won't show print on console till it gets focus

 Red [
	title "cheap toggle button & spin-box demo "
	auth: "ne1"
	date: "2018/11"
	rights: ""
	Needs: 'View	;can't have view with cli
]


gview: layout [
	title "user button demo"
	size 350x500	
	backdrop ivory

	style headline: text font-size 12  bold		
	style tog-button:  base  60x20 font-size 10  draw ([])	
	
	;need ^M^/ to force newline on windows. need to test other OD
	;why is this indented?
	;
	pad -50x0
	box {these need lots more tweeking^M^/ to look and work as most users & coders expect}


	return below
	headline "tog-button toggle with word"
	target-w: field  40x20 font-size 12 ""
	
	;cheap toggle button, changes alternate color when clicked, 3 different ways
	;you could change/check the button/text to toggle
	;with multiple tog-buttons you can use face and or face/extra to avoid extra words to change
	;
	otb-w: tog-button  font-size 9 bold  "-Click-Me-" font-color red [	

			either any [unset? :toggle-w toggle-w = false][
					toggle-w: true
					otb-w/font/color: black
					otb-w/color: gold
					print "on"	target-w/text: "On"
				][
					toggle-w: false
					otb-w/font/color: silver
					otb-w/color: snow
					print "off"	target-w/text: "Off"
				]
			]
	;; 		 on-create [	;optional, don't technically need on-create
	;; 				toggle-w: true
	;; 				otb-w/font/color: snow
	;; 				otb-w/color: black
	;; 		]	



	headline "tog-button toggle with text"
	target-t: field  40x20 font-size 12 ""
	
	otb-t: tog-button  font-size 9 bold  "-Click-Me-" font-color red [	

			either face/text = "Off" [

					face/text: "On"
					face/font/color: black
					face/color: gold
					print "on"	target-t/text: "On"
				][
					face/text: "Off"
					face/font/color: silver
					face/color: snow
					print "off"	target-t/text: "Off"
				]
			]


	headline "tog-button toggle with face/extra"
	target-e: field  40x20 font-size 12 ""
	
	otb-extra: tog-button  font-size 9 bold  "-Click-Me-" font-color red [	

			either any [ face/extra/tog = false][  ;none? face/extra if don'r un-create
					face/extra/tog: true
					face/font/color: black
					face/color: gold
					print "on"	target-e/text: "On"
				][
					face/extra/tog: false
					face/font/color: silver
					face/color: snow
					print "off"	target-e/text: "Off"
				]
			]
		 on-create [	;optional, don't technically need on-create
						;in some cases face may not initalize this early
				face/extra: make map! [tog true ]  
				;face/font/color: snow
				;face/color: black
		]	


	pad 0x15
	headline "spin-box for integer"
	;cheap spinbox up/dn buttons. change words if you clone multiple spinboxes
	; style wonn't help much yet since it needs unique hooks and names,
	; a function might work and would make it easier to specify sizes colors ranges types
	;
	spin-box-grid: group-box "" 155x55 font [ name: "Consolas"  size: 9 	color: black ][
		   across
		    text "spin-box" f-grid: field 25x25 data (form 1) 

	        below	pad -4x-4
	         base 15x15 beige draw [
					;font ft	text 5x5 "V"
					fill-pen linear red green blue
					triangle 6x0 12x12 0x12
				] [f-grid/text:  to-string (to-integer f-grid/data) + 1]
			pad 0x-8
	         base 15x15 beige draw [
					;font ft	text 5x5 "V"
					fill-pen linear red green blue
					triangle 6x12 0x0 12x0
				] [f-grid/text: to-string (to-integer f-grid/data) - 1]
		 ]
 

]
;interpreted
;view/no-wait/flags/options gview ['resize][offset: 100x150]

;paste into console use is like -e
view/flags/options gview ['resize][offset: 100x150]

comment {
	todo
		add
rmv no-wait for gist
}