Flyout hotspots and plugins

Tangent12

Schüler

Beiträge: 90

Wohnort: Liverpool, UK

Beruf: Application Developer

1

Samstag, 3. April 2010, 12:53

Hi all,

I'm trying to get a plugin size and position to match that of a flyout hotspot in its flyout state.
When I click a flyout plugin I want it to flyout as normal but then I want to position and scale a plugin to be the exact same size as it.
Both the flyout hotspot and the plugin are the same swf so same physical dimensions.

The problem that I have is that the flyout hotspot is a different size when depending on the size of the screen but the plugin is not.
I have tried setting the width of the plugin using prop to make it scale but it doesn't seem to scale at the same rate as the flew out hotspot.

Can anyone help?

Thanks.

T12

Liverpool based panoramic photography, virtual tour and
web media organisation specialising in high quality web experiences.

Zum Seitenanfang

michael crane

Schüler

Beiträge: 133

2

Samstag, 3. April 2010, 19:10

does this help ?
get the size of the screen

Zum Seitenanfang

michael crane

Schüler

Beiträge: 133

3

Sonntag, 4. April 2010, 13:39

I tried this as I want something similar but as you say it only seems to work when full screen.

Quellcode

<krpano version="1.0.8" >

		<preview type="grid(cube,16,16,512,0xCCCCCC,0xFFFFFF,0x999999);" details="16" />

	<view hlookat="12" vlookat="0" fov="105" />

<plugin name="textshow" style="button"
	    	html="[p]show pic[/p]"
	    	align="leftbottom" x="100" y="100"
			onclick="action(showpic1);"
			keep="true"	
			/>	
<hotspot name="spot" 
	     	url="image1.jpg "
	     	keep="true"
	     	ath="45"
	     	atv="54"
	     	rx="-22.5" ry="-26.25" rz="-50.1"
			 zoom="true" distorted="true"
	     	width="340" height="233"
	     	edge="center" ox="" oy=""
	     	visible="true" enabled="true" 
 	     	zorder="1"
	     	alpha="1" blendmode="normal" smoothing="true"
 	     	refreshrate="auto"
 	     	flying="0.0"
	     	onclick="if(flying == 0.0, flyout()  );
	              	if(flying == 1.0, flyback() );"
			 backup_rx="0"
	     	backup_ry="0"
	     	backup_rz="0"
			 />	

			 <plugin name="pic1"
			 width="340" height="233"
			 url="image1.jpg"
			 align="center"
			 visible="false"
         	onclick="set(plugin[pic1].visible,false)"
			 />
<action name="showpic1">
set(plugin[pic1].visible,true);
div(x1,stagewidth,3);
div(y1,stageheight,3);
tween(plugin[pic1].x,0);
tween(plugin[pic1].y,0);	
tween(plugin[pic1].width,get(x1));
tween(plugin[pic1].height,get(y1));
trace(x1);
trace(y1);
</action>	
		 
<action name="flyout">
tween(rx, 0);
tween(ry, 0);
tween(rz, 0);
div(x1,stagewidth,3);
div(y1,stageheight,3);
tween(hotspot[spot].ath,0);
tween(hotspot[spot].atv,0);	
tween(hotspot[spot].width,get(x1));
tween(hotspot[spot].height,get(y1));
trace(x1);
trace(y1);
tween(flying, 1.0);
</action>			 
<style name="button" 
	   	keep="true"
	   	url="./textfield.swf"
	   	css="p{color:#FFFFFF; font-family:Arial; font-size:14; margin-left:5; margin-right:5; text-align:center; }"
	   	children="false"
	   	visible="true"
	   	width="100"
	   	height="22"
	   	backgroundcolor="0x000000"
	   	roundedge="5"
	   	shadow="1"
	   	borderwidth="0"
		   glow="4"
	   		   	/>			
		
</krpano>

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

4

Mittwoch, 7. April 2010, 22:52

Hi,

Zitat von »Tangent12«

The problem that I have is that the flyout hotspot is a different size when depending on the size of the screen but the plugin is not.
I have tried setting the width of the plugin using prop to make it scale but it doesn't seem to scale at the same rate as the flew out hotspot.

sorry, but that's not possible yet,
the size of the (distorted) hotspots is always relative to the pano size,
the size of the plugin not,

best regards,
Klaus

Zum Seitenanfang

Tangent12

Schüler

Beiträge: 90

Wohnort: Liverpool, UK

Beruf: Application Developer

5

Donnerstag, 8. April 2010, 19:43

Hi Klaus,

Thanks for the clarification.
I have managed to fudge it to create the effect I was looking for and it seems robust in the viewer, the XML is a bit clunky though.
I found that if I set height of the plugin to a percentage (55% in this case) and the width to "prop" I could make the size of the plugin match the size of the "flewout" hotspot.
This was done by adjusting the x and y values of an image identical to the hotspot within an swf plugin.
Not the most elegant method but it seems to work, the plugin stays exactly the same size as the flyout hotspot regardless of screen resoluion, it even scales seemlessly when dragging the browser size around.
See the code below:

Quellcode

<plugin name="plg_blocks" 
	url="plg_blocks.swf"
	keep="false"
	capture="false" 
	align="center"
	edge="center"
	scale="1.0"
	x="0" y="0" alpha="1"
	visible="false" width="prop" height="55%" zorder="1" onclick="" handcursor="false"
/>

I am just putting the finishing touches to it and I'll post it in the Showcase forum.

Thanks.

T12

Liverpool based panoramic photography, virtual tour and
web media organisation specialising in high quality web experiences.

Zum Seitenanfang

Tangent12

Schüler

Beiträge: 90

Wohnort: Liverpool, UK

Beruf: Application Developer

6

Sonntag, 9. Mai 2010, 15:17

Hi Klaus,

I mentioned that I'd let you know when the pano I mentioned was done.
It is now live on my (new) website here.

If you click on the yellow tab next to the worktop board in the first pano or the handles board on the wall next in the second pano you will see that I crudely made the plugin line up with the flyout hotspot.

Thanks for your help.

T12

Liverpool based panoramic photography, virtual tour and
web media organisation specialising in high quality web experiences.

Zum Seitenanfang