You are not logged in.

Zephyr

Professional

  • "Zephyr" started this thread

Posts: 994

Location: Netherlands

Occupation: Web developer

  • Send private message

1

Tuesday, August 14th 2012, 8:51pm

containers and interaction

I want to create some sort of lightbox effect. So I thought I create a container with a black bg, which holds a textfield or somesort. Now I want to hide the whole container when I click in the black area of the container. But it seems there's no interaciton possible with the container. I tried to enable it, capture, handcursor, but it won't work. Is this the architectecture of the container? I would hate to use an image to force interaction.

Source code

1
2
3
4
5
6
	<layer name="popup_container" type="container" width="100%" height="100%" scalechildren="false" align="center" alpha="0" autoalpha="true" keep="true" bgcolor="0x000000" bgalpha="0.5" zorder="100"
		open="tween(layer[popup_container].alpha, 1);" close="tween(layer[popup_container].alpha, 0);"	enabled="true" capture="true" handcursor="true" onclick="showlog(); trace('click'); layer[popup_container].close();" >
	<layer name="link_63" type="container" bgcolor="0xbb1c21" bgalpha="1"  align="lefttop" width="85" height="85" x="85" y="85" scalechildren="false" maskchildren="true" keep="true">
		<layer name="map_btn" url="%SWFPATH%/skin/images/sprite.png" crop="85|0|85|85" onovercrop="85|85|85|85" />
	</layer>
	</layer>
3d childrens game using krpano Game
Minify your xml with my krpano XML Compressor
Krpano XML Parsing Error Checklist
Available for hire (krpano xml, javascript, actionscript, flash, php and ipad plugins).

Arsdezi

Intermediate

Posts: 174

Location: Ukraine

  • Send private message

2

Wednesday, August 15th 2012, 12:05am

Hi!
Just yesterday, I learned a new type layer and playing with sample code from exemle (krpano player viewer 1.08.15) on the menu …\xml-usage\buttonsbar got to hide menubar with the standard action(tween, set, with onhower button and etc).


Source code

1
…	<!-- use the textfield with border, background, rounded edges and shadow as container for the buttons -->	<layer name="buttons" keep="true" url="%SWFPATH%/plugins/textfield.swf" align="bottom" width="252" height="44" y="-18"		background="true" backgroundcolor="0x000000" backgroundalpha="0.667" alpha="0.5"		border="true" bordercolor="0xFFFFFF" roundedge="25"		shadow="0.5" shadowrange="10" shadowcolor="0xFFFFFF" ONHOVER="tween(layer[buttons].alpha, 1.0, 0.5); tween(layer[buttons].y,12, 0.3);" ONOUT="tween(layer[buttons].alpha, 0.5, 0.5); delayedcall(2, showtext('to the pano');tween(layer[buttons].y,-18, 0.5););"  	>		<layer name="left"  url="vtourskin.png" scale="0.5" align="lefttop" x="10"  y="6" crop="0|192|64|64"  ondown="buttonglow(get(name));set(hlookat_moveforce,-1);"  onup="buttonglow(null);set(hlookat_moveforce,0);" />		<layer name="right" url="vtourskin.png" scale="0.5" align="lefttop" x="50"  y="6" crop="64|192|64|64" ondown="buttonglow(get(name));set(hlookat_moveforce,+1);"  onup="buttonglow(null);set(hlookat_moveforce,0);" />		<layer name="up"    url="vtourskin.png" scale="0.5" align="lefttop" x="90"  y="6" crop="0|256|64|64"  ondown="buttonglow(get(name));set(vlookat_moveforce,-1);"  onup="buttonglow(null);set(vlookat_moveforce,0);" />		<layer name="down"  url="vtourskin.png" scale="0.5" align="lefttop" x="130" y="6" crop="64|256|64|64" ondown="buttonglow(get(name));set(vlookat_moveforce,+1);"  onup="buttonglow(null);set(vlookat_moveforce,0);" />		<layer name="in"    url="vtourskin.png" scale="0.5" align="lefttop" x="170" y="6" crop="0|320|64|64"  ondown="buttonglow(get(name));set(fov_moveforce,-1);"      onup="buttonglow(null);set(fov_moveforce,0);"     />		<layer name="out"   url="vtourskin.png" scale="0.5" align="lefttop" x="210" y="6" crop="64|320|64|64" ondown="buttonglow(get(name));set(fov_moveforce,+1);"      onup="buttonglow(null);set(fov_moveforce,0);"     />	</layer>…


It's work!


As I understand it easy enough to do embedded layer or plug-in:

Source code

1
2
<layer name="main container">
	<layer name="embed 1"/>	<layer name="embed 2"/>	<layer name="embed 3"/>	</layer>



Try new
architectecture! *thumbup*
Panoreal — to make and see this wonderful world! *whistling*

Posts: 1,850

Occupation: Virtual Tours - Photography - Krpano developer

  • Send private message

3

Wednesday, August 15th 2012, 12:14am

Interesting. However, a 1px gif will work without a fuss.
KRPano Developer: Portfolio ::Gigapixel Tagging Solutions - Porfolio 2 :: Facebook :: Twitter :: reddit.com/r/VirtualTour

Zephyr

Professional

  • "Zephyr" started this thread

Posts: 994

Location: Netherlands

Occupation: Web developer

  • Send private message

4

Wednesday, August 15th 2012, 12:28am



I knew about this method, a textfield or a 2px image usually does the trick. But with the new update, I was curious if it would be possible with the layer type container.

btw, in the past I had issues with textfields as a parent. I got uncontrollable results. Can't remember the exact problem, but after numerous tries, I went back to the 2px method. Something with reading out the width/height resulting in a 0 (even when loaded) or the textfield not being clickable. Again Im not sure, and perhaps it's already fixed.

Alsoo, sachagriffin, I'd sugest using a 2px image. There was a issue/limitation in how often a image could be repeated/stretched or was it some rounding issue. Sometimes when I put an 1px image to 100% wide and heigh, it still didnt cover everything.
3d childrens game using krpano Game
Minify your xml with my krpano XML Compressor
Krpano XML Parsing Error Checklist
Available for hire (krpano xml, javascript, actionscript, flash, php and ipad plugins).

Posts: 1,850

Occupation: Virtual Tours - Photography - Krpano developer

  • Send private message

5

Wednesday, August 15th 2012, 1:42am

Textfields set with autosize have heights that aren't set at a determined time. One method I use is before setting a textfield with text, I set the height to -1, set the text, and read out the height in a loop. When it's not -1, I have my height.
Yes, I know about the 2px thing. The overlay I use is actually 16x16 for some forgotten reason.
KRPano Developer: Portfolio ::Gigapixel Tagging Solutions - Porfolio 2 :: Facebook :: Twitter :: reddit.com/r/VirtualTour

6

Wednesday, August 15th 2012, 2:10pm

Hi,
But it seems there's no interaciton possible with the container. I tried to enable it, capture, handcursor, but it won't work
it seems you missed the bgcapture setting: ;-)
http://krpano.com/docu/xml/#layer.bgcapture

best regards,
Klaus

Zephyr

Professional

  • "Zephyr" started this thread

Posts: 994

Location: Netherlands

Occupation: Web developer

  • Send private message

7

Wednesday, August 15th 2012, 2:48pm

bgcapture


<3! Thanks.

Btw why call it bgcapture? Why not just use capture? Btw will this propogate to the children in the layer (iow, the children will alsoo get the background containers onclick)
3d childrens game using krpano Game
Minify your xml with my krpano XML Compressor
Krpano XML Parsing Error Checklist
Available for hire (krpano xml, javascript, actionscript, flash, php and ipad plugins).

8

Wednesday, August 15th 2012, 3:03pm

Btw why call it bgcapture? Why not just use capture?
capture is already in use for the element itself, using it for the background layer was not possible for several reasons.


Btw will this propogate to the children in the layer (iow, the children will alsoo get the background containers onclick)
no, the bgcapture setting only affects the background layer, nothing else...

best regards,
Klaus