World: r3wp

button: make rebface [
		size:	12x4
		text:	""
		data:	reduce [
			load #{

    89504E470D0A1A0A0000000D49484452000000070000000E0806000000E35D06

    1B0000001374455874536F667477617265005245424F4C2F566965778FD91678

    0000006D49444154789C7DD0210EC0201404510EC78DB90937402030080C09E6

    3743B250DAA62423D8574C9D9939EFBD3D6377B7CB3ADA9C608CB1EABD6FD440

    AD35ABB56E1410504A39911704A49436F2B502628C6FD4AB0319D527E69C672F

    6450C0811A2884305B481A0513FF7EFC050B081E1B1469CACD0000000049454E
				44AE426082
				}
			load #{

    89504E470D0A1A0A0000000D49484452000000070000000E0806000000E35D06

    1B0000001374455874536F667477617265005245424F4C2F566965778FD91678

    0000004E49444154789C63F8FFFF3F838B8BCB7F740C12874B6CDEBC198E6162

    0CE812C80A50242F5DBAF4FFE1C387608C2209921828499802ACAE8561E28D85

    09BE7CF9125512844182300C0F3E7C010F0010F10EBBAF4E057A000000004945
				4E44AE426082
			}
			load #{

    89504E470D0A1A0A0000000D49484452000000070000000E0806000000E35D06

    1B0000001374455874536F667477617265005245424F4C2F566965778FD91678

    0000007049444154789C63F8FFFF3F838B8BCB7F740C12874BFCBB3F0B8E6162

    0C30893F97AAE018A60045F2FBF7EF244AC28CFBF4E9139C0D97FC753C118CDF

    BD7B0767C3257FEEF306E3972F5FC2D9C449FED8620AC64F9F3E85B331241F3E

    7C885B1219C32541F8E974063886071FBE800700F5AD02E08E740D5300000000
				49454E44AE426082
			}
		]
		image:	first data
		effect:	[mix extend 3x7 1x1]
		font:	make default-font [align: 'center valign: 'middle]
		feel:	make default-feel [
			over: func [face act pos] [
				face/image: either act [face/data/3] [face/data/1]
				show face
			]
			engage: func [face act event] [
				either act = 'down [
					face/image: face/data/2 show face face/action face
				][
					if act = 'up [face/image: face/data/1 show face]
				]
			]
		]
		init:	does [effect/4: size - image/size]
	]

Mmm. Seems no better or worse to me. Maybe the text is slightly easier 
to read.

I don't think the extra code size is worth it.

Ashley, what do you think about  tab-panel's color = colors/widget 
?   slider's color  = colors/widget  as well, so it's background 
is indistinguishable from tab-panel.  I tend to think tab-panel is 
wrong to use colors/widget

*its background*

This code segment may be bigger in appearance, but it is more efficient
when run, both in memory and time.

data: [
    #[image! 7x14 #{

        000000444444444444444444444444444444000000444444444444FFFFFF

        FFFFFFFFFFFF444444444444444444FFFFFFFAFAFAFAFAFAFAFAFAF7F7F7

        444444444444FAFAFAF7F7F7F7F7F7F2F2F2EEEEEE444444444444F7F7F7

        F7F7F7F7F7F7EEEEEEE9E9E9444444444444F7F7F7F2F2F2F2F2F2E9E9E9

        E1E1E1444444444444EEEEEEEEEEEEEEEEEEE1E1E1D2D2D2444444444444

        EEEEEEEEEEEEE9E9E9E1E1E1D2D2D2444444444444E9E9E9E9E9E9E9E9E9

        E1E1E1D2D2D2444444444444E9E9E9E5E5E5E5E5E5E1E1E1D2D2D2444444

        444444E1E1E1E1E1E1E1E1E1D2D2D2D2D2D2444444444444D2D2D2D2D2D2

        D2D2D2B3B3B3B3B3B3444444444444444444B3B3B3B3B3B3B3B3B3444444
        444444000000444444444444444444444444444444000000
    } #{
        FF0000000000FF000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00FF0000000000FF
    }]
    #[image! 7x14 #{

        000000444444444444444444444444444444000000444444444444B3B3B3

        B3B3B3B3B3B3444444444444444444B3B3B3B3B3B3B3B3B3B3B3B3B3B3B3

        444444444444B3B3B3B3B3B3D2D2D2E1E1E1E1E1E1444444444444B3B3B3

        D2D2D2D2D2D2E1E1E1E1E1E1444444444444B3B3B3D2D2D2D2D2D2E1E1E1

        E1E1E1444444444444B3B3B3D2D2D2D2D2D2E1E1E1E1E1E1444444444444

        B3B3B3D2D2D2D2D2D2E1E1E1E1E1E1444444444444B3B3B3D2D2D2D2D2D2

        D2D2D2E1E1E1444444444444B3B3B3B3B3B3D2D2D2D2D2D2D2D2D2444444

        444444B3B3B3D2D2D2D2D2D2E1E1E1E1E1E1444444444444B3B3B3E1E1E1

        E1E1E1E9E9E9E1E1E1444444444444444444E9E9E9E9E9E9E9E9E9444444
        444444000000444444444444444444444444444444000000
    } #{
        FF0000000000FF000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00FF0000000000FF
    }]
    #[image! 7x14 #{

        000000444444444444444444444444444444000000444444444444FEDF9A

        FEDF9AFEDF9A444444444444444444FEDF9AFCD27AFCD27AFCD27AFEDF9A

        444444444444FEDF9AFCD27AF7F7F7FCD27AFEDF9A444444444444FEDF9A

        FCD27AF7F7F7FCD27AFEDF9A444444444444FCD27AFCD27AF2F2F2FCD27A

        FCD27A444444444444FAC761FAC761EEEEEEFAC761FAC761444444444444

        F9BE4BF9BE4BE9E9E9F9BE4BF9BE4B444444444444F9BE4BF9BE4BE9E9E9

        F9BE4BF9BE4B444444444444F8B435F8B435E5E5E5F8B435F8B435444444

        444444F8B435F8B435E1E1E1F8B435F8B435444444444444F8B435F8B435

        F8B435F8B435F8B435444444444444444444E59700E59700E59700444444
        444444000000444444444444444444444444444444000000
    } #{
        FF0000000000FF000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00000000000000000000
        00FF0000000000FF
    }]
]

(as a comment on Ashley's code)

Just specifying the images directly instead of all the load calls 
nearly halves the memory usage, in theory.

How does drawing them instead compare?

Of course if you are concerned about code size you can do this:

data: [
    #[image! 7x14 64#{

        AAAAREREREREREREREREREREAAAARERERERE////////////RERERERERERE

        ////+vr6+vr6+vr69/f3RERERERE+vr69/f39/f38vLy7u7uRERERERE9/f3

        9/f39/f37u7u6enpRERERERE9/f38vLy8vLy6enp4eHhRERERERE7u7u7u7u

        7u7u4eHh0tLSRERERERE7u7u7u7u6enp4eHh0tLSRERERERE6enp6enp6enp

        4eHh0tLSRERERERE6enp5eXl5eXl4eHh0tLSRERERERE4eHh4eHh4eHh0tLS

        0tLSRERERERE0tLS0tLS0tLSs7Ozs7OzREREREREREREs7Ozs7Ozs7OzRERE
        REREAAAAREREREREREREREREREREAAAA
    } 64#{

        /wAAAAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

        AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
        AP8AAAAAAP8=
    }]
    #[image! 7x14 64#{

        AAAAREREREREREREREREREREAAAARERERERE/t+a/t+a/t+aRERERERERERE

        /t+a/NJ6/NJ6/NJ6/t+aRERERERE/t+a/NJ69/f3/NJ6/t+aRERERERE/t+a

        /NJ69/f3/NJ6/t+aRERERERE/NJ6/NJ68vLy/NJ6/NJ6RERERERE+sdh+sdh

        7u7u+sdh+sdhRERERERE+b5L+b5L6enp+b5L+b5LRERERERE+b5L+b5L6enp

        +b5L+b5LRERERERE+LQ1+LQ15eXl+LQ1+LQ1RERERERE+LQ1+LQ14eHh+LQ1

        +LQ1RERERERE+LQ1+LQ1+LQ1+LQ1+LQ1RERERERERERE5ZcA5ZcA5ZcARERE
        REREAAAAREREREREREREREREREREAAAA
    } 64#{

        /wAAAAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

        AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
        AP8AAAAAAP8=
    }]
    #[image! 7x14 64#{

        AAAAREREREREREREREREREREAAAARERERERE/t+a/t+a/t+aRERERERERERE

        /t+a/NJ6/NJ6/NJ6/t+aRERERERE/t+a/NJ69/f3/NJ6/t+aRERERERE/t+a

        /NJ69/f3/NJ6/t+aRERERERE/NJ6/NJ68vLy/NJ6/NJ6RERERERE+sdh+sdh

        7u7u+sdh+sdhRERERERE+b5L+b5L6enp+b5L+b5LRERERERE+b5L+b5L6enp

        +b5L+b5LRERERERE+LQ1+LQ15eXl+LQ1+LQ1RERERERE+LQ1+LQ14eHh+LQ1

        +LQ1RERERERE+LQ1+LQ1+LQ1+LQ1+LQ1RERERERERERE5ZcA5ZcA5ZcARERE
        REREAAAAREREREREREREREREREREAAAA
    } 64#{

        /wAAAAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

        AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
        AP8AAAAAAP8=
    }]
]

I take your point about inadvertent double clicking, but since the 
side effect is not that great, I'm not sure the majority should be 
protected from such behaviour.

I get lot of problems with the new slider implementation into listview 
widget

1) on init the screen is back until you click into the  listview 
displaying area

2) the scroller are jagging they jump when we clic on the bar

3) on refresh with new data  I get an internal  crash in rebgui

benchmark building table:0:00:00.062
** Script Error: Cannot use path on none! value
** Where: wake-event
** Near: ar-wid: face/parent-face/pane/:arrow-ind
either act [ar-wid/show?: true]
>>

I get now this error message when I start the list ...

see the rebgui list code in the rebolfrance.org page ;)

the only thing that have changed in the 0.51 version of my listview 
code is the scroller replaced by slider data[arrows]

Anton

 1) Code size. What it loses in code size it gains in aesthetics and 
 simplified behaviour (check out the request-color and request-date 
 actions in %tour.r to see the extra "state" code required by the 
 original implementation). I like Brian's base64 solution.

 2) Tab-panel color: I've based this on the WinXP color scheme. Try 
 changing it to colors/window, it just doesn't look right. But slider 
 can be used on a colors/widget or colors/window background. WinXP 
 solves this by using a gradient / edge so that it is distinguishable 
 on either. So for RebGUI, a number of solutions are possible:

  - add a new colors/slider background that "works" with both widget 
  and windows background colors

  - add a new colors/tab-panel background that "works" with both widget 
  and windows background colors

  - use an effect like gradient to distinguish the slider background 
  color
		- or edge
		- or?
	I'm open to suggestions on this one. ;)

Brian
	1) I like the in-line image solution

 2) I like the base 64 solution even better! One problem, the button-down 
 image renders the same as button-up (i.e. 1st and 2nd images render 
 the same ... even though a quick glance at the data suggests they 
 are different?)

Graham
	Any examples where the desired behaviour is used?

shadwolf

 I did the same (replaced scroller call with "slider data [arrows]") 
 for text-list / table and it worked fine for me. Check for code that 
 tried to reference sub-faces in the old scroller widget (as Anton 
 refactored slider to use just one face).

Ashley, I just ran the data section in View and then did a mold/all 
on the data to get the first version and wrote it to the clipboard 
and pasted it in a text editor. I copied the binary sections to a 
block and then ran a: "" foreach x data [append a rejoin ["64#{" 
enbase/base x 64 "}"]] , and then wrote a to the clipboard and edited 
in the #[image! ... specs into the resulting data. I may have missed 
a step, or there may have been duplicate images in the source data. 
The process could be automated easily though.

That's just broad strokes, but it should give you an idea. You could 
even generate this kind of thing with the prebol preprocessor.

Ashley, the very first web site I visited .. cnn.com, has these menus 
down the left hand side coloured in blue, with the active one in 
red.

If you click on the red one ie. the active one, it still refreshes 
the page for you.

Given it's a one-line change, I'll include it in the next build bar 
any strong objections.

Ashley i prefer to wait until next release because if I strat to 
use divergent version this will not be cool

Active tab refreshing: with regards to user experience, I'm with 
Ashley, but with regards to simpler implementation that gives the 
user (the developer using the widget or the end-user) a choice how 
to deal with the event, I'm with Graham. Either way, I don't think 
people are going to lose too much sleep over this one. If I was using 
tab-panels, I would probably try to catch redundant refreshes, if 
my refreshes were slow, whether the current implementation catches 
them for me or not, in order to be safe with possibly future implementations. 
:)

Ashley, colors/widget used by tab-panel:  I still think it is an 
inherent problem of tab-panel, but it is better I pursue one of the 
other ways you suggested, which probably needs doing anyway. It's 
easier for me to change the slider than for you to change the tab-panel 
colour, which affects more widgets.  (I admit I must be a flat colour 
man..)

ashley, can you add in slider style a function wich changes the size 
of the dragger ?

or can you say me how can change it easily

thank you

BTW, I just logged on to paypal.com website, and they have 5 tabs 
at the top.  Clicking on an active tab still refreshes the page. 
 I am sure that there are however just as many websites that do not 
refresh.

Here's an inconsistency.  If I have a button, and bring up an alert, 
the button remains highlited even after I move the mouse away.  But 
if the button does something else, it dehilites when I move the mouse 
away.

How does one create a widget in a hidden state?  I've got two tab-panels 
one over the other.  I want to hide the one underneath, and expose 
it when I hide the top one?

Use SHOW and HIDE

in Vid you could set the show? facet to false.

perhaps I need to display/layout, and then use hide ?

That should do it...

nope.

Hm...  Show and Hide are Natives I wonder what RebGUI is doing to 
stop them from working...

Got it.
Use a 

do [ widget/show?: false ] 

in the layout.

Is there a word similar to 'focus ?

The following *should* work:

	display "Test" [text false]  or  [text #[false]]


But don't for some reason (the layout parser checks for it). I'll 
fix this for the next build.

display "" [ sum: field "10" button "clear" [ sum/text: copy "" show 
sum ]] do-events

after a couple of clears, the text in the field is no longer visible

Luc: dragger size is controlled by ratio, so just do a "sld/ratio: 
a / b show sld" or similar in your code.

Graham: replace the "show sum" with "rebfocus sum"

Ok.  But if I leave the mouse over the button, it takes 2 clicks 
to clear the field

Fixed in latest build.

Is the current build able to be encapped?

Not with a pre-1.3 SDK. %rebgui-widgets.r uses some 1.3 specific 
words such as case, unless, etc. Once it starts making greater use 
of AGG-specific draw commands there will be no going back.