variable in textfield / plugin

Tuur · October 5, 2010 at 12:18 AM

Hi,

i lik e to make a variable in my textfield as it is a plugin..

i have this:

Code

<data name="html_thumb1"> 
		<p align="middle"><font face="Verdana"   size="11"><textformat leftmargin="" rightmargin="">
		<img src="../thumbs_lanterna/lanterna1.jpg" height="" width="" align="top"/>
		
here i like to have something like : get(vartext_1)  but then that it works.. ??
	
	            </textformat></font></p>     


	</data>


	
	
<plugin name="thumb1"
 	        url="../plugins/textfield.swf"
	        keep="true"
 	        visible="false" enabled="true" handcursor="true" capture="true" children="true"
 	        zorder="110"
 	        alpha="1.00" blendmode="normal"
 	        smoothing="true"
 	        origin="leftbottom" edge=""
 	        x="30" y="30"
 	        width="220" height="150"
	        scale="1"
	        onloaded=""
	        onover=""
	        onhover=""
	        onout=""
	        ondown=""
	        onup=""
	        onclick=""
	        autosize="none"
	        background="true"
	        backgroundcolor="0xFFFFFF"
	        blur="0"
	        bordercolor="0x000000"
	        borderwidth="2"
	        css="data:defaultcss"
	        glow="0"
	        glowcolor="16777215"
	        html="data:html_thumb1"
	        roundedge="8"
	        selectable="false"
	        shadow="3"
	        textblur="0"
	        textglow="0"
	        textglowcolor="16777215"
	        textshadow="0" 
			parent="spot21"
	        />

Display More

on line 5 you can see what i want... is that possible?

anybody??

a while ago we fixed this with a hotspot...http://www.krpano.com/forum/wbb/inde…d&threadID=2948
but will this also work now??
i can't get it..

thanx

tuur

VN2011 · October 5, 2010 at 2:10 AM

tuur i need this also. today i could not figure out a way to do this so i had to create a data set for each plugin rather than inserting what i wanted as a variable. i hope someone smarter than us says it can be done.

Tuur · October 5, 2010 at 3:08 AM

mmm i hope so to..

i've got this 12+ tours in 7 languages..

Tuur

VN2011 · October 5, 2010 at 5:03 PM

i want to find a way to make the text a variable right now i have to have a data set for each hotspot. if i could make that a variable it could be done with 1 action. i need the image path to be a variable also.

<data name="cpaerial">
<textformat leftmargin="10" rightmargin="10">


Canal Park Aerial 360


<a href="event:action(s0);">
<img vspace="1" src="thumbs/panorama.jpg" />
</a>
</textformat>
</data>

<data name="cpboyngull">
<textformat leftmargin="10" rightmargin="10">


Boy and Gull Statue


<a href="event:action(s1);">
<img vspace="1" src="thumbs/cpboyngull.jpg" />
</a>
</textformat>
</data>

Tuur · October 5, 2010 at 5:38 PM

m mmm...
i tried to do it as we diid here with a hotspot.. http://www.krpano.com/forum/wbb/inde…d&threadID=2948

...

oke now i have:

Code

<plugin name="spot22" url="buttons/mappoint2.png" parent="map_lanterna" zorderchildren="false" zorder="10" align="lefttop" edge="center" keep="true"  scale="0.9"  x="225" y="350" onclick="action(load2);" onover="set(plugin[spot22].zorder,20);set(plugin[thumb2].visible,true)" onout="set(plugin[thumb2].visible,false);set(plugin[spot22].zorder,10);" onloaded="taal_thumb();text_var();style_var();
			"/>




<data name="html_thumb2"> 
		
	</data>


<plugin name="thumb2"
 	        url="plugins/textfield.swf"
	        keep="true"
 	        visible="false" enabled="true" handcursor="true" capture="true" children="true"
 	        zorder="90"
 	        alpha="1.00" blendmode="normal"
 	        smoothing="true"
 	        origin="leftbottom" edge=""
 	        x="30" y="30"
 	        width="220" height="320"
	        scale="1"
	        onloaded="taal_thumbs();text_var();style_var();"
	        onover=""
	        onhover=""
	        onout=""
	        ondown=""
	        onup=""
	        onclick=""
	        autosize="none"
	        background="true"
	        backgroundcolor=""
	        blur="0"
	        bordercolor="0x000000"
	        borderwidth="2"
	        css=""
	        glow="0"
	        glowcolor="16777215"
	        html="data:html_thumb2"
	        roundedge="8"
	        selectable="false"
	        shadow="3"
	        textblur="0"
	        textglow="0"
	        textglowcolor="16777215"
	        textshadow="0" 
			parent="spot22"
	        />


<action name="taal_thumbs">
	
		txtadd(data[code=css].content,"body { color:",get(taal_color),"; font-weight:",get(taal_weight),"; font-family:",get(taal_family),";}");
		txtadd(data[html_thumb2].content,"<p>",get(tf_thumb2),"</p>");
		set(plugin[thumb2].css,data:css);


		set(update,view);
	
	
	
	</action>
	
	
<action name="text_var">
		set(tf_thumb2), <p>DIT is een TEST </p>
		<br />
		<p><img src="ilovekrpano.jpg" align="center" width="" height=""  visible="true" keep="true" alpha="1" zorder="110"/></p>;
		


	</action>






	


<action name="style_var">
		set(taal_color,"#ffffff");
		set(taal_weight,"bold");
		set(taal_family,"Verdana,Arial,Helvetica");


		set(taal_color2,"#003399");
		set(taal_weight2,"italic");
		set(taal_family2,"Arial");




	</action>

Display More

offcourse i put the actions also in the onstart..

Pinsane!!! HEEEEELLLLP

what is going wrong??

Cheers

Tuur

Tuur · October 5, 2010 at 6:21 PM

oke this works!!!!

only the picture doesn't show...

Code

<action name="text_var">
		set(tf_thumb2, <p> Bij de groentenstalletjes 
		<br />
		<img src="../ilovekrpano.jpg" align="center" width="" height=""  visible="true" keep="true" alpha="1" zorder="110"/> </p>)
		


	</action>






	


<action name="style_var">
		set(taal_color,"#000000");
		set(taal_weight,"");
		set(taal_family,"Verdana,Arial,Helvetica");


		set(taal_color2,"#003399");
		set(taal_weight2,"italic");
		set(taal_family2,"Arial");




	</action>	


	
<action name="taal_thumbs">
	
		txtadd(data[code=css].content,"body { color:",get(taal_color),"; font-weight:",get(taal_weight),"; font-family:",get(taal_family),";}");
		txtadd(data[html_thumb2].content,"<p>",get(tf_thumb2),"</p>");
		set(plugin[thumb2].css,data:css);


		set(update,view);
	
	
	
	</action>






<data name="html_thumb2"> 
		
	</data>


<plugin name="thumb2"
 	        url="plugins/textfield.swf"
	        keep="true"
 	        visible="false" enabled="true" handcursor="true" capture="true" children="true"
 	        zorder="90"
 	        alpha="1.00" blendmode="normal"
 	        smoothing="true"
 	        origin="leftbottom" edge=""
 	        x="30" y="30"
 	        width="220" height="320"
	        scale="1"
	        onloaded="taal_thumbs();text_var();style_var();"
	        onover=""
	        onhover=""
	        onout=""
	        ondown=""
	        onup=""
	        onclick=""
	        autosize="none"
	        background="true"
	        backgroundcolor=""
	        blur="0"
	        bordercolor="0x000000"
	        borderwidth="2"
	        css=""
	        glow="0"
	        glowcolor="16777215"
	        html="data:html_thumb2"
	        roundedge="8"
	        selectable="false"
	        shadow="3"
	        textblur="0"
	        textglow="0"
	        textglowcolor="16777215"
	        textshadow="0" 
			parent="spot22"
	        />
			


<plugin name="spot22" url="buttons/mappoint2.png" parent="map_lanterna" zorderchildren="false" zorder="10" align="lefttop" edge="center" keep="true"  scale="0.9"  x="225" y="350" onclick="action(load2);" onover="set(plugin[spot22].zorder,20);set(plugin[thumb2].visible,true)" onout="set(plugin[thumb2].visible,false);set(plugin[spot22].zorder,10);" onloaded="taal_thumbs();text_var();style_var();
			"/>

Display More

and in the onstart.. you put this

action(text_var);
action(style_var);

after the load action of the first pano..

But why doesn't my picture show...

Cheers
Tuur

Tuur · October 5, 2010 at 6:28 PM

got it... wrong url..

Wow this is super!!

cheers
Tuur

pinsane · October 6, 2010 at 9:46 AM

Glad you got it working tuur!

Here's a different approach that you might find useful. I too found that the image would dissappear if you used an action to write the contents of a data field. I'm still not sure I understand how to get around that issue. Are you using full blown url paths to remedy the problem?

At any rate, here's a solution that does what you asked for and seems to preserve the images as well. It allows you to put get statements in a data node, and automatically replace the get statements with the values of the variable. I've taken the liberty of including an example using your html data node:

Code

<data name="thumb1">
		<p align="middle"><font face="Verdana"   size="11"><textformat leftmargin="" rightmargin="">
		<img src="../thumbs_lanterna/lanterna1.jpg" height="" width="" align="top"/>
		here i like to have something like :
			the language is get(language) <br/> <b> get(phrase[thumb1].language[get(language)].text) </b><br/>
 		but then that it works.. ??
	
	            </textformat></font></p>     
</data>

Note that there is both a simple get statement (get(language)), and a very complicated one (get(phrase[thumb1].language[get(language)].text) embedded in the html. The second get statment accesses the appropriate language via an associative array I'll describe later.

First, the following javascript needs to be included in your tour:

Code

function kr_eval_get_in_string(varname) {
	var krpano=document.getElementById("krpanoSWFObject");
	var content= krpano.get(varname);
	var subs = content.match(/get\((?:[^()]+|\(([^()]+|\(([^()]+|(\([^()]+\)))*\))*\))+\)/g); /* deals with up to 4 sets of nested parenthesis */
	var name;
	var val;
	var i;
	for (i=0;i < subs.length;i++)
	{
		name=subs[i].replace(/^get\(/,"");
		name=name.replace(/\)$/,"");
		val=kr_resolve(name);
		content=content.replace(subs[i],val);
	}
	krpano.set(varname,content);
}
function kr_resolve(argument) {
	var krpano=document.getElementById("krpanoSWFObject");
	var subs = argument.match(/get\((?:[^()]+|\(([^()]+|\(([^()]+|(\([^()]+\)))*\))*\))+\)/g); /* deals with up to 4 sets of nested parenthesis */
	var name;
	var val;
	var i;
	if (subs != null) {
		for (i=0;i < subs.length;i++)
		{
			name=subs[i].replace(/^get\(/,"");
			name=name.replace(/\)$/,"");
			val=kr_resolve(name);
			argument=argument.replace(subs[i],val);
		}
		return(krpano.get(argument));
	} else {
		return(krpano.get(argument));
	}
}

Display More

These functions allow you to place get() statements inside your data node, and then replace them with their values on demand simply by calling kr_eval_get_in_string with the argument data[thumb1].contents.

I'm including an example that shows how you can build an associative array to manage the language customization.

Code

<phrase name="thumb1" >
		<language name="dutch" text="goedemorgen" />
		<language name="english" text="good morning" />
		<language name="spanish" text="buenas días" />
		<language name="japanese" text="ohayou gozaimasu" />
		<language name="french" text="bonjour" />
		<language name="german" text="guten morgen" />
		<language name="pig_latin" text="oodgay orningmay" />
	</phrase>

Note that by using this approach you can handle multiple languages in the onhover event for with a relatively clean xml command:

Code

<plugin name="foo"
	...
	onhover="showtext(get(phrase[get(name)].language[get(language)].text)"
	...

Here we access the appropriate associative array by naming it with the same name as the plugin, then we access the appropriate language using a global variable named language.

Here's a working example xml file that allows you to change the language on-the-fly using a combobox selector. Note that the default language value is set in the first line:

Code

<krpano language="dutch" >
	<preview type="grid(cube,16,16,512,0xCCCCCC,0x333333,0x999999);" details="16" />
	<phrase name="thumb1" >
		<language name="dutch" text="goedemorgen" />
		<language name="english" text="good morning" />
		<language name="spanish" text="buenas días" />
		<language name="japanese" text="ohayou gozaimasu" />
		<language name="french" text="bonjour" />
		<language name="german" text="guten morgen" />
		<language name="pig_latin" text="oodgay orningmay" />
	</phrase>
	<phrase name="thumb2" >
		<language name="dutch" text="goede middag" />
		<language name="english" text="good afternoon" />
		<language name="spanish" text="buenas tardes" />
		<language name="japanese" text="konnichiwa" />
		<language name="french" text="bonjour" />
		<language name="german" text="guten tag" />
		<language name="pig_latin" text="oodgay afternoonway" />
	</phrase>
	<phrase name="thumb3" >
		<language name="dutch" text="goede middag" />
		<language name="english" text="good evening" />
		<language name="spanish" text="buenas noches" />
		<language name="japanese" text="konbanwa" />
		<language name="french" text="bonsoir" />
		<language name="german" text="guten abend" />
		<language name="pig_latin" text="oodgay eveningway" />
	</phrase>
	<phrase name="thumb4" >
		<language name="dutch" text="goede nacht" />
		<language name="english" text="good night" />
		<language name="spanish" text="buenas noches" />
		<language name="japanese" text="oyasumi nasai" />
		<language name="french" text="bonne nuit" />
		<language name="german" text="gute nacht" />
		<language name="pig_latin" text="oodgay ightnay" />
	</phrase>


<action name="update_thumb">
	if (data[%1].orig === null,
		copy(data[%1].orig,data[%1].content);
	<!--else-->,
		copy(data[%1].content,data[%1].orig);
	);
	js("kr_eval_get_in_string(data[%1].content);");
	txtadd(plugin[%1].html,"data:",%1);
</action>


<data name="thumb1">
		<p align="middle"><font face="Verdana"   size="11"><textformat leftmargin="" rightmargin="">
		<img src="../thumbs_lanterna/lanterna1.jpg" height="" width="" align="top"/>
		here i like to have something like :
			the language is get(language) <br/> <b> get(phrase[thumb1].language[get(language)].text) </b><br/>
 		but then that it works.. ??
	
	            </textformat></font></p>     
</data>
<data name="thumb2">
		<p align="middle"><font face="Verdana"   size="11"><textformat leftmargin="" rightmargin="">
		<img src="../thumbs_lanterna/lanterna1.jpg" height="" width="" align="top"/>
		here i like to have something like :
			 <br/> <b> get(phrase[thumb2].language[get(language)].text) </b> the width is get(stagewidth) <br/>
 		it works!!!
	
	            </textformat></font></p>     
</data>
<data name="thumb3">
		<p align="middle"><font face="Verdana"   size="11"><textformat leftmargin="" rightmargin="">
		<img src="../thumbs_lanterna/lanterna1.jpg" height="" width="" align="top"/>
		more text:
			stage height is get(stageheight) <br/> <b> get(phrase[thumb3].language[get(language)].text) </b> <br/>
 		it still works!!!
	
	            </textformat></font></p>     
</data>
<data name="thumb4">
		<p align="middle"><font face="Verdana"   size="11"><textformat leftmargin="" rightmargin="">
		<img src="../thumbs_lanterna/lanterna1.jpg" height="" width="" align="top"/>
		and still more text:
			<br/><b> get(phrase[thumb4].language[get(language)].text) </b><br/>
 		yeah!
	
	            </textformat></font></p>     
</data>
<plugin name="thumb1"
 	        x="30" y="30"
		  html="data:thumb1"
		  style="thumbstyle"
	        />
<plugin name="thumb2"
 	        x="270" y="30"
		  html="data:thumb2"
		  style="thumbstyle"
	        />
<plugin name="thumb3"
 	        x="510" y="30"
		  html="data:thumb3"
		  style="thumbstyle"
	        />
<plugin name="thumb4"
 	        x="750" y="30"
		  html="data:thumb4"
		  style="thumbstyle"
	        />
<style name="thumbstyle" 
 	        url="%SWFPATH%/plugins/textfield.swf"
	        keep="true"
 	        visible="true" enabled="true" handcursor="true" capture="true" children="true"
 	        zorder="110"
 	        width="220" height="150"
 	        alpha="1.00" blendmode="normal"
 	        smoothing="true"
 	        origin="leftbottom" edge=""
	        onhover="showtext(get(phrase[get(name)].language[get(language)].text));"
		  onloaded="txtadd(update,'update_thumb(',get(name),');');call(update);"
	        background="true"
	        backgroundcolor="0xFFFFFF"
	        blur="0"
	        bordercolor="0x000000"
	        borderwidth="2"
	        css="data:defaultcss"
	        roundedge="8"
	        selectable="false"
	        shadow="3"
/>	
<plugin name="combobox"
		url="%SWFPATH%/plugins/combobox.swf"
		align="lefttop"
		x="10"
		y="10"
		keep="true"
		onloaded="action(setupitems);"
 /> 
<action name="setupitems">
	 removeall();
	additem(dutch, set(language,dutch);update_plugins(););
	additem(german, set(language,german);update_plugins(););
	additem(english, set(language,english);update_plugins(););
	additem(french, set(language,french);update_plugins(););
	additem(spanish, set(language,spanish);update_plugins(););
	additem(japanese, set(language,japanese);update_plugins(););
	additem(pig latin, set(language,pig_latin);update_plugins(););
</action> 
<action name="update_plugins">
	foreach(plugin,action[%0].i,
		if (plugin[get(action[%0].i)].update !== null,
			call(plugin[get(action[%0].i)].update);
		);
	);
</action>
<!--	_foreach_action
	private function to execute foreach loop body action -->
<action name="_foreach_action">
	trace("Error in foreach loop: push/pop stack corrupted"); <!-- this line should never execute -->
</action>
<!--	foreach <objectid> <index.str> <body.str>
	foreach loop function which iterates the action across each of the objects-->
<action name="foreach"> <!--objectid.str,index.str,body.str-->
	set(%2,0);
	push(action[_foreach_action].content);
	set(action[_foreach_action].content,"if(%2 LT %1.count,%3;inc(%2);_foreach_action(););");
	_foreach_action();
	pop(action[_foreach_action].content);
</action>
</krpano>

Display More

Hope this helps!

steve

Tuur · October 6, 2010 at 10:13 AM

He Master!

Quote

Are you using full blown url paths to remedy the problem?

no just the right name of the picture.

Wow Steve, that's a code..

thanx so much for your time and input.

When i read the code i even understand most of it and that for a dutch ;-P
Gonne use this for sure!
But this webside makes before visiting the tour a language selection for the tour.
And i know that i can fix that aswell but i got it running for now so i keep that..

That style name thing iforgot... that's a goo done aswell

so, thanx again and for the next tour i'll gonna learn this code and check/test it out!

Cheers

Tuur

Participate now!