Mailing List Archive: 49091 messages
  • Home
  • Script library
  • AltME Archive
  • Mailing list
  • Articles Index
  • Site search
 

advanced view example... for Paul

 [1/4] from: media:quazart at: 25-Oct-2001 9:32


Hello World, Paul is investigating View... I am currenlty working on a tool which could help you see some direct view useage. The tool integrates VID and direct view manipulation... I thought it could help some of you to go through it... This is a working although completely useless (fopr now) application. I'm sharing it at this stage mainly for UI learning. Also note the different approach to setups (using styles, pre-built faces, dynamic face, static face assignment, etc) are all different solutions I ended up while researching how view and VID relate to each other... starting from scratch now, I would really code the tool in a more homogenous way... It is NOT optimized, not very commented, but still strikes a nice balance between advanced and simple (I find)... I also was impressed at the speed that the timeline has. change the timeline's in and out points by pressing on in/out and dragging the mouse... here goes! -MAx -- Binary/unsupported file stripped by Listar -- -- Type: image/png -- File: polished.png -- Attached file included as plaintext by Listar -- -- File: whip.r REBOL[ title: "whip" author: "moa" date: 2001/10/09 version: 1.0.0 ] ;-------------------------------------- ;--- global data ;--- timeline-size: 300x65 tracksize: 20 ;height of each track in timeline timeruler: 10 ; one bar every x frames timeruler-offset: 1 ;the offset of the first bar timeruler-color: 120.120.120 cut-req: none timeline-tracks: 0 ; how many tracks in the timeline shot-list: [] ; description of shots in the timeline (there can be multiple segments per shot) time-in: -3 ; where the timeline starts time-out: 53 ; where the timeline ends bg-image: load %polished.png gbl-segment-list: [ [ ;name in length command ;------------------------------------------------ [track-name: "track1" track-color: 0] ["*1" 1 10 "render3d" ] ["*2" 21 10 "fixedframe 200"] ["*3" 41 10 "BLA"] ["*4 " 11 10 "render3d" ] ["*5 " 31 10 "render3d" ] ][ [track-name: "Total Track" track-color: 1] ["*10" 1 40 "BLA"] ] ] color-list: [ 100.150.255 140.200.120 200.140.140 150.160.180 140.180.150 190.170.170 190.190.140 210.180.100 180.170.190 190.140.210 100.190.180 160.160.160 ] ;-------------------------------------------------- ;--- ;--- OBJECTS ;--- ;-------------------------------------------------- ;------------------------ ;--- segment! ;------------------------ segment!: make object! [ name: none in: 1 length: 1 command: none from-blk: func [ datablk ][ name: to-string first datablk in: second datablk length: third datablk command: fourth datablk ] ] ;------------------------ ;--- ;--- active-thing ;--- ;--- note: currently used only for segments ;--- active-thing: make face [ ; the currently selected "thing". data: none ; the name of the shot (can be then be retrieved from segment list...) type: ; the type of data which is refered by data face: none ; the face which is associated with this data active-edge: ; the edge object which is used on the active segment make object! [ color: black effect: none size: 2x2 ] normal-edge: ; the edge object which is used on normal segments make object! [ color: 140.140.140 effect: 'bevel size: 1x1 ] normal-font: make object! [ name: "arial" style: 'bold size: 10 color: 255.255.255 offset: 2x2 space: 0x0 align: 'center valign: 'middle shadow: 1x1 colors: [255.255.255 255.180.55] ] active-font: make object! [ name: "arial" style: 'bold size: 10 color: 255.0.0 offset: 2x2 space: 0x0 align: 'center valign: 'middle shadow: 1x1 colors: [255.255.255 255.180.55] ] ] whip-look: make face [ thin-edge: make edge [ color: 140.140.140 size: 1x1 effect: 'bevel ] thin-iedge: make edge [ effect: 'ibevel color: 140.140.140 size: 1x1 ] button-font: make font [ size: 10 color: white shadow: 1x1 ] button-hifont: make button-font [ color: 140.180.255 ] ] ;------------------------------------------- ;--- ;--- STYLES ;--- ;------------------------------------------- q-style: stylize [ sbutton: button %polished.png 75x20 with [font: whip-look/button-font] edge [size: 1x1 color: 150.150.150] effect [ tile contrast 10 gradmul 0x1 130.130.130 70.70.70 ;draw ['pen 0.0.255 'box 0x0 (face/size) ] ] feel [ over: func [face action event] [ either action [ face/font: whip-look/button-hifont show face ][ face/font: whip-look/button-font show face ] ] ] vtext: vtext with [feel: none] groupname: vtext "qtitle" 50x22 edge [effect: 'bevel color: 128.128.128 size: 1x1] %polished.png effect [contrast 20 tile gradcol -1x0 110.110.110 80.90.100] ;button: button %polished.png edge [size: 1x1 color: 160.160.160] effect [tile contrast 30 colorize 180.180.180] ibutton: button 160.160.160 edge [size: 1x1 color: 140.140.140] effect [gradmul 0x-1 140.140.140 100.100.100] title: box 150.170.190 font [size: 12 style: [bold ] space: 1x0 ] para [scroll: 0x-1] shadow 1x1 edge [size: 1x1 color: 140.140.140 effect: 'bevel] effect [gradmul 0x1 140.140.140 100.100.100] titleb: button 150.170.190 edge [size: 1x1 color: 140.140.140 effect: 'bevel] effect [gradmul 0x1 140.140.140 100.100.100] test: box edge [size: 1x1 color: 140.140.140 effect: 'ibevel ] stext: vh3 220.180.20 shadow -1x-1 feel [engage: func [a1 a2 a3] [] over: none redraw: none detect: none] sfield: field 50x20 edge [size: 1x1] effect [gradient 1x1 100.150.240 0.60.120] font [color: white] titlebar: title feel [ engage: func [face action event][ either action = 'down [ face/data: event/offset ][ if find [away over] action [ win: face/parent-face win/offset: win/offset + event/offset - face/data show win ] ] ] ] ] ;-------------------------- ;--- UI ;--- xaos-window: make object! [ wsize: 500x200 tsize: 480x15 tlabel: "Default Window" wcontent: none wpane: make face [] regen-window: func [][ tmp-win: layout [ styles q-style across space 0x0 origin 0x0 titlebar tlabel tsize edge [size: 1x1] titleb "X" 20x15 [close] edge [size: 1x1] return wcontent: box para [margin: 2x2] wsize red * .75 ] wcontent/pane: wpane window: tmp-win ] window: none setpane: func [newpane] [ newpane/offset: 0x0 wpane: newpane if wcontent [ wcontent: newpane print "HO" ] autosize ] autosize: does [ wsize: wpane/size tsize: ((wsize * 1x0) + (-20x15)) ;wcontent/offset: 0x0 if wcontent [ wcontent/offset: 0x0 print "HEY" ] ] open: does [ regen-window window/offset: 300x100 view/options window 'no-title ] close: does [unview window ] ] main-ui: [ tabs 60 styles q-style ;origin 0x0 backdrop %polished.png effect [contrast 20 tile gradcol 1x1 100.100.100 60.60.60] across space 0x20 do [ tbar: layout [ styles q-style backdrop black origin 2x3 space 0x0 across pad 0x2 ttitle: groupname "projects" return sbutton "save" sbutton "load" sbutton "clear" ] tbar/offset: 0x0 ttitle/size/x: tbar/size/x - 4 ] box with [pane: tbar size: tbar/size + 2x2] edge [size: 1x1 color: 140.140.140 effect: 'ibevel] return do [ tbar: layout [ styles q-style backdrop black origin 2x3 space 0x0 across pad 0x2 ttitle: groupname "segment" return sbutton "new" sbutton "edit" sbutton "delete" ] tbar/offset: 0x0 ttitle/size/x: tbar/size/x - 4 ] box with [pane: tbar size: tbar/size + 2x2] edge [size: 1x1 color: 140.140.140 effect: 'ibevel] return space 0x20 return space 0x0 return do [ tbar: layout [ styles q-style backdrop black origin 2x3 space 0x0 across pad 0x2 ttitle: groupname "Timeline" return pad 0x2 timeline-box: box black (timeline-size + 2x1) return sbutton "in" 30 feel [ engage: func [face action event][ if action = 'down [ face/data: reduce [event/offset/x time-in ] face/edge: whip-look/thin-iedge show face ] if action = 'up [ face/edge: whip-look/thin-edge show face ] if find [over away] action [ ;probe face/data time-in: ((first face/data) - event/offset/x) + second face/data if time-in >= time-out [ time-in: time-out - 1 change next face/data (time-out - 1) change face/data event/offset/x ] ;print [time-in "->" time-out] timeline: build-timeline timeline-size time-in time-out timeline-box/pane: timeline show timeline-box ] ] redraw: none ] sbutton "out" 30 feel [ engage: func [face action event][ if action = 'down [face/data: reduce [event/offset/x time-out ] print "down"] if find [over away] action [ ;probe face/data time-out: ((first face/data) - event/offset/x) + second face/data if time-in >= time-out [ time-out: time-in + 1 change next face/data (time-in + 2) change face/data event/offset/x ] ;print [time-in "->" first face/data "->" time-out] timeline: build-timeline timeline-size time-in time-out timeline-box/pane: timeline show timeline-box ] ] ] ] tbar/offset: 0x0 ttitle/size/x: tbar/size/x - 4 ] box with [pane: tbar size: tbar/size + 2x2] edge [size: 1x1 color: 140.140.140 effect: 'ibevel] return space 0x10 return space 0x0 tab vtext "start" tab vtext "end" tab vtext "dur." tab vtext "start" return tab sfield tab sfield tab sfield tab sfield ] ;---------------------------------------------- ;--- ;--- FUNCTIONS ;--- ;---------------------------------------------- ;------------------------- ; build-segment-blk ;------------------------- build-segment-blk: function [seglist] [segment segblk][ segblk: copy [] foreach datablk seglist [ segment: make segment! [] segment/from-blk datablk append segblk segment ] return segblk ] ;------------------------- ; build-timeline ;------------------------- build-timeline: function [bar-size time-in time-out][time-pane out-point][ total-time: 0 segment-sizes: 0 ;prin "bar: " ;probe bar-size ;prin "time in: " ;probe time-in ;prin "time out: " ;probe time-out total-time: time-out - time-in ;prin "total time: " ;probe total-time time-factor: bar-size/x / total-time ;prin "factor: " ;probe time-factor segment-face!: make face[ color: 160.160.160 effect: [gradmul 0x-1 140.140.140 100.100.100] offset: 0x0 edge: whip-look/thin-edge font: whip-look/button-font ] segment-face!/size/y: tracksize time-pane: make face [ ;-------------------------------- ;--- create ruler ;-------------------------------- do [ fx: [ draw []] lines: select fx 'draw clear lines repend lines ['pen timeruler-color] repeat num (time-out - time-in) [ if (type? ((num + time-in - timeruler-offset ) / timeruler )) = integer! [ line-start: 0x0 line-start/x: num * time-factor line-end: 0x100 line-end/x: num * time-factor repend lines ['line line-start line-end red] ] ] ] color: black image: none size: bar-size + 1x-1 offset: 0x0 pane: copy [] edge: make edge [color: white / 2 size: 1x1 effect: none] effect: fx ] ; probe time-pane/feel timeline-tracks: length? gbl-segment-list yoff: 0 ;--------------------- ;-- create tracks ;--------------------- foreach track gbl-segment-list [ do first track ;print ["^/-----------^/--> TRACK: " track-name] segblk: build-segment-blk next track ;--------------------- ;-- create segments ;--------------------- foreach segment segblk [ ;print ["^/->segment: " segment/name] tmp-face: make segment-face! [ ] ;------------------------ ;--- CALCULATE IN-POINT ;--- tmp-face/offset/x: to-integer ((segment/in - time-in) * time-factor) tmp-face/offset/y: yoff ;------------------------ ;--- CALCULATE OUT-POINT (Size) ;--- ;--- good version ;tmp-face/size/x: to-integer (segment/length * time-factor) out-point: segment/in + segment/length - time-in tmp-face/size/x: (to-integer (out-point * time-factor)) - tmp-face/offset/x tmp-face/text: segment/name tmp-face/para/wrap?: false tmp-face/feel: make tmp-face/feel [ engage: func [face action event] [ print [action face/text] if action = 'down [print "notepad" ] redraw: func [a1 a2 a3] [print "rdraw"] ] ] tmp-face/pane: make face [ size: tmp-face/size - 4x0 size/y: 3 offset: 1x1 color: first skip color-list track-color edge: make edge [size: 1x1 color: white / 2 effect: 'ibevel ] ] append/only time-pane/pane tmp-face ] yoff: yoff + tracksize + 10 ] ;prin ": " ;probe return time-pane ] ;--------------------------------------------------- ;--- START APPLICATION print "-----------" timeline: build-timeline timeline-size time-in time-out ;timeline/offset: 0x0 main-pane: layout main-ui timeline-box/pane: timeline xwin: make xaos-window [] xwin/setpane main-pane gui_pic: to-image xwin/wpane view layout [box gui_pic] save/png %/z/programming/whip_ui.png gui_pic browse %/z/programming/whip_ui.png ;xwin/open

 [2/4] from: media::quazart::com at: 25-Oct-2001 10:07


OOPS! I just noticed that the (small) image did not go through listar... ah well. You must have the polished.png image from RT in the same drawer as the script... I also noticed that the attached script has some bad code at the end... which was meant for saving a picture of the ui instead of opening it!!! Just replace code at the end with: ;--------------------------------------------------- ;--- START APPLICATION timeline: build-timeline timeline-size time-in time-out main-pane: layout main-ui timeline-box/pane: timeline xwin: make xaos-window [] xwin/setpane main-pane xwin/open -MAx ----- Original Message ----- From: "Media" <[media--quazart--com]> To: "reblist" <[rebol-list--rebol--com]> Sent: Thursday, October 25, 2001 9:32 AM Subject: [REBOL] advanced view example... for Paul
> Hello World, > Paul is investigating View... I am currenlty working on a tool which could
<<quoted lines omitted: 4>>
> sharing it at this stage mainly for UI learning. Also note the different > approach to setups (using styles, pre-built faces, dynamic face, static
face
> assignment, etc) are all different solutions I ended up while researching > how view and VID relate to each other... starting from scratch now, I
would
> really code the tool in a more homogenous way... > It is NOT optimized, not very commented, but still strikes a nice balance
<<quoted lines omitted: 26>>
> timeline-tracks: 0 ; how many tracks in the timeline > shot-list: [] ; description of shots in the timeline (there can be
multiple segments per shot)
> time-in: -3 ; where the timeline starts > time-out: 53 ; where the timeline ends
<<quoted lines omitted: 56>>
> active-thing: make face [ ; the currently selected "thing". > data: none ; the name of the shot (can be then be retrieved from segment
list...)
> type: ; the type of data which is refered by data > face: none ; the face which is associated with this data
<<quoted lines omitted: 82>>
> vtext: vtext with [feel: none] > groupname: vtext "qtitle" 50x22 edge [effect: 'bevel color: 128.128.128
size: 1x1] %polished.png effect [contrast 20 tile gradcol -1x0 110.110.110 80.90.100]
> ;button: button %polished.png edge [size: 1x1 color: 160.160.160] effect
[tile contrast 30 colorize 180.180.180]
> ibutton: button 160.160.160 edge [size: 1x1 color: 140.140.140] effect
[gradmul 0x-1 140.140.140 100.100.100]
> title: box 150.170.190 font [size: 12 style: [bold ] space: 1x0 ] para
[scroll: 0x-1] shadow 1x1 edge [size: 1x1 color: 140.140.140 effect: 'bevel] effect [gradmul 0x1 140.140.140 100.100.100]
> titleb: button 150.170.190 edge [size: 1x1 color: 140.140.140 effect:
'bevel] effect [gradmul 0x1 140.140.140 100.100.100]
> test: box edge [size: 1x1 color: 140.140.140 effect: 'ibevel ] > > stext: vh3 220.180.20 shadow -1x-1 feel [engage: func [a1 a2 a3] [] over:
none redraw: none detect: none]
> sfield: field 50x20 edge [size: 1x1] effect [gradient 1x1 100.150.240
0.60.120] font [color: white]
> titlebar: title feel [ > engage: func [face action event][
<<quoted lines omitted: 64>>
> ;origin 0x0 > backdrop %polished.png effect [contrast 20 tile gradcol 1x1 100.100.100
60.60.60]
> across > space 0x20
<<quoted lines omitted: 16>>
> ] > box with [pane: tbar size: tbar/size + 2x2] edge [size: 1x1 color:
140.140.140 effect: 'ibevel]
> return > do [
<<quoted lines omitted: 15>>
> ] > box with [pane: tbar size: tbar/size + 2x2] edge [size: 1x1 color:
140.140.140 effect: 'ibevel]
> return > space 0x20
<<quoted lines omitted: 44>>
> engage: func [face action event][ > if action = 'down [face/data: reduce [event/offset/x time-out ] print
down ]

 [3/4] from: greggirwin:mindspring at: 25-Oct-2001 11:32


Very cool Max! It took me a minute to figure out that I had to click and drag the in or out *button* to see the effect, but then it worked fine. I wanted to click the button then drag the timeline. I've found the performance of View to be good, but dependent on the size of the face you're refreshing. For example, I did a little bouncing line/spirograph thing (drawing, in a loop, on a face that has no child faces) and the performance is heavily dependent on the size of the face. It's zippy on an 80x60 face and creeps at ~1024x768. I'm running a P900 against W2K FWIW. One question, do you pronounce xaos as "chaos" or more like "taos"? --Gregg

 [4/4] from: media:quazart at: 25-Oct-2001 13:59


----- Original Message ----- From: "Gregg Irwin" <[greggirwin--mindspring--com]> To: <[rebol-list--rebol--com]> Sent: Thursday, October 25, 2001 1:32 PM Subject: [REBOL] Re: advanced view example... for Paul
> Very cool Max!
gee thanks,
> It took me a minute to figure out that I had to click and drag the in or
out
> *button* to see the effect, but then it worked fine. I wanted to click the > button then drag the timeline.
yeah, I tried to point that out in my following reply but I know its not completely obvious...
> One question, do you pronounce xaos as "chaos" or more like "taos"?
xaos - chaos I would have liked xos more (cross OS ... i.e. multi-platform) but then the pronounciation is even harder to get. in time, xos might win out though... ;-) -Maxim funny how people mix-up speed with fast... speed is neither fast nor slow

Notes
  • Quoted lines have been omitted from some messages.
    View the message alone to see the lines that have been omitted