Posts by lizard.king

Hi

To execute a action when a plugin fires an event, it is possible to add a event handler or callback in javascript like this

webvr.onentervr = vrEntered; //vrEntered is the name of the function handling the event/callback

in in xml like this

<plugin name="webvr" .........			
	onentervr="webvr_onentervr();"
/>

If there are several places in a project that need to listen to the same callback (e.g. my plugin needs to listen to webvr events that are also handled by the webvr.xml), the callbacks are overwritting each other resp. on the last callback that is set survives. So in the end there can only be one event listner for a plugin.

For the krpano events I can register callback in javascript like this

krpano.events.addListener("onviewchanged", onviewchangedhandler);

or in xml like this

<events name="map_events" onnewpano="mousehotspotsinit()" />

With this subscription pattern it is possible to have several listeners for the same event.

It there is similar way to subscribe to plugin events?

E.g. something like

webvr.events.addListener("onentervr ", onentervr);

would be great. The above examples mainly target webvr, but I wonder if there is a general solution for proper plugin event subscription.

klaus.krpano
Excellent!
Thanks for the new function. I'm eagerly waiting for 1.22

Thanks for the input!

The approach by Klaus is great! It does exactly what I need. A direct api call as mentioned by Klaus would be even more helpful, but for the time been the proposed solution is more than good enough

The other solutions like

krpano.scene.getArray().forEach( function(scene) {
	if(scene.group == 'expo') {
		// ...
	}
});

would be great if there is a fixed check expression, but they dont work for me, because I want to to be able to specifiy the check expression in action code style in a attribute.

Hi

I have a javascript function to filter scenes. The filter creteria expression sits in a attribute of another xml element, e.g. like this:

  <lkmenu name="expomenu" title="Exposition" linkedscenefilter="get(group)=='expo'" />

My code filters the scenes by constructiong some action code from the linkedscenefilter expression. That code assigns the result to a variable (in my plugin) and as the next action I fetch the variable value with get:

//Wrap the filter with set() and calc() to assign the result to an intermediiate variable 
const checkaction = "set(plugin[" + plugin.name + "].linkedscenefilterresult,calc(" + menu.linkedscenefilter + "));";

for (var i = 0; i < krpano.scene.count; i++) {
	const scene = krpano.scene.getItem(i);
	krpano.call(checkaction , scene);  //Calling the check action with the scene as the caller object
	const result = krpano.get("plugin[" + plugin.name + "].linkedscenefilterresult"); 
	if (result) {
		//further processing if the result is true
	}
}

This implementation mostly works, but there are 2 problems:

• It is very, very ugly, since calculation and retrieving the result are separated and a intermediate variable is used!
• Sometimes, mainly on the first call while krpano is still busy, the code fails since "call" is async resp. puts the commands in a queue and "get" is sync. Therefore "get" is sometimes executed before the check code has been executed and therefore returns a wring result.

Is there a way to make the code a bit nicer ( return the result of the calc directly to the javascriopt code instead of using calc first and then fetching the result with get) and even more important to ensure that the check expression is always executed before the result is fetched (or again to return the result directly)?

I'd be grateful for some advice how to work around this. Thanks!

I have just added the VR Thumbnails Menu Plugin to my tour and thinking about using/buying the Grid menu plugin as well.

3 questions about this:

• Is there a option to display the grid menu the same way as the VR Thumbnails Menu Plugin? Like in VR I would like to display the groups first and oly after a group has been selected the scenes that are in the group should be displayed,
• This question is about both, the Grid menu plugin and VR Thumbnails Menu. Is it possible to have a group with just one scene (and obviously other groups that have a bunch of scenes), which would be called directly instead of going into the group scenes display?
• Also about both versions of the plugin. Is it possible to define a onclick action for a menu entry (e.g. a group entry with no members) which would be executed instead of loading a scene?

I have experimented with the above formula. It is doing a perfect job for the scale changes that are associated with changed FOV. I javascript it looks as follows:

function calcscale(orgscale) {
	let fovscale=orgscale/Math.tan(0.5*krpano.view.fov*Math.PI/180);
	if(fovscale<.4) {fovscale=.4;};
	return fovscale;
}

Now I want to integrate the distance/depth of the hotspot into the formula.

I've been experimenting for hours and managed to come up with the following:

function calcscale(orgscale, depth) {
	const sc = Math.min(krpano.stagewidth, krpano.stageheight) /Math.sqrt(krpano.stagewidth * krpano.stageheight) ;

	let newscale=orgscale/(depth/4500)/Math.tan(0.5*krpano.view.fov*Math.PI/180);
	newscale= newscale*sc;
	if(newscale<.05) {newscale=.05;};
	return newscale;
}

It kind of works, but when I change the window size the behaviour is different from kdanos normal behaviour. I am also not sure if this is the correct way to integrate depth at all (my math skills suck) and the division by 4500 is also just a result of experimenting.

I'd be gratefull if someone with better math skills could enlighten me how to do this properly.

Thanks Klaus!
I can see that this would set the hotspot scale based on FOV including clamping, but all hotspots will have the same size/scale. What would be the additional logic to take the depth of the hotspot into account as well?

After all, I want the hotspots to be smaller when they are far away, but only to some extend so they stay visible.

Hi

krPano nicely zooms the hotspots depending in their distance resp. depending on the depth value of the hotspot.

This is just great in most cases, but sometime when hotspots are really far away they are becoming so small that they are are hard to see or are almost not visible anymore. Just increasing the scale of the hotspots style doesnt help either, since that will make them huge if they are close by. Setting the scale/size manually would be problematic as well, since I am currently dealing with a tour with approx. 1100 panos and more than 5000 hotspots.

Is there a way how set a minimal and/or maximal size/zoomfactor for the hotspots or a simply trick to achieve that they remain visible?
Alternatively, how does the calculation for the hotspot zooming work (so I can code my own zooming logic)?

Excellent advice!
Thanks Klaus!

So the problem wasnt that the hotspots created by the plugin didnt get removed, but that they were created again, since the hotspots of the previous scene were still around in their renamed form during blending.

Fixing the problem through the blending setting wasnt what I want, but a small change to the code (as suggested) fixed the issue.

Just in case someone else should stumble into a similar problem, this is the code I use to filter out the old hotspots that are still around during blending:

    function onnewpanohandler() {
        for (let i = krpano.hotspot.count - 1; i > -1; i--) {
            const orghs = krpano.hotspot.getItem(i);
            if (orghs.style == "navarrow" && !(orghs.name.includes('_blending') && /[0-9]$/.test(orghs.name))) {
                
                ..... creating more hotspots based on the org hotspot ........

                orghs.setvars({ visible: false });
            };
        };


        placearrows();
        mousespot();

    }

The !(orghs.name.includes('_blending') && /[0-9]$/.test(orghs.name)) part filters out all hotspots that include _blending and end with a number.

I was wrong ! The problem is still there! It just didnt occur for a while due to another small bug which had a seemingly positive side effect (apart from creating other problems).

When moving from one scene to the next with a 3D transition the hotspots generated by my plugin are still not removed.

The problem only occurs when my plugin is active and when 3d transitions are enabled with use3dtransition="true". If there are no 3d transations are not enabled and the next scene is simply loaded with skin_loadscene (in vtourskin.xml) the hotspots generated by the plugin are removed as expected. If the plugin is not loaded the org hotspots (which are normaly made invisible by the plugin) are properly removed as expected.

Here are a few links demonstrating the problem:

• Pluging active and 3D Transitions enabled
  http://weilenmann.net/2cv2023test/3d…8,5.56,120,0,0;
  In this demo 3dtransitions are enabled (http://weilenmann.net/2cv2023test/pl…yle_3dtrans.xml) and the plugin display the navigation arrows is active (link to code below).
  When moving from one scene to the next, the navigation arrows of the previous scene are not removed and still visible (but the cant be clicked since they are not part of that scene).
  Even when I try to removed the additional hotspots on the on remove pano event (as shown in the plugin code), the hotspots are not removed.
  This is just a guess, but maybe the problem is related to additional hotspots that krpano seems to generated during 3d transitions (the have names that end with blending and a number).
  
• Plugin enabled and 3D Transitions disabled
  http://weilenmann.net/2cv2023test/lo…,21.06,120,0,0;
  In this demo the plugin is active (code blow) and 3d transitions are disabled (http://weilenmann.net/2cv2023test/pl…e_loadscene.xml) and scene changes are executed through skin_loadscene.
  All hotspots generated by the plugin are removed as expected.
  
• Plugin disabled and 3D Transition enabled
  http://weilenmann.net/2cv2023test/no…,-6.79,120,0,0;
  When the plugin is not loaded the org hotspots of the scene are shown, 3d transitions work as expected and only the hotspots of the current scene are displayed.
  

The plugin code can be found here: http://weilenmann.net/2cv2023test/pl…varrowplugin.js

Any idea what is going wrong resp. what I am doing wrong in my plugin?

Solved the issue by removing the hotspots before scene on scene change.

@indexofrefraction: Thanks for pointing out the small bug, eventhough it had no effect since the hotspot with index 0 is part of the skin.

Removing the arrows on the onremovepano event solves the problem, but results in the arrows visualy disappearing from the view before the transition to the next scene is taking place. Therefore I would like to avoid this if possible (and after all it seems possible with the foarward/back scene changes).

Small update on the text below:
It is not that the hotspots are not removed during scene change. They got recreated, since the hotspots of the previous scene were still around in a renamed form during the 3d transition.
Just check the explanation by Klaus further down.
-------------------------------------------------------------------------------------------------------
Hi

My plugin dev skills have been progressing nicely over the past few days, but now I am stuck and confused again.

I've built a simple plugin which replaces the standard arrows (those with skin_hotspotstyle) that are displayed in the tours, with my own arrows that rotate/move with the view direction, like the navigation arrows in google street view.

This is working quite nicely, but for some reason I dont understand, my arrows dont always get removed when the scene changes.
They get removed when the scene is changed with the normal navigation elements of the virtual tour (forward/back arrows or clicking a thumbnail). When the scene change is triggered by clicking my own navigation arrows, the arrwos are still visible in the next scene together with the arrows of that next scene. Since the "normal" scene change is executed through skin_loadscene and the scene change which is triggered through the navigation arrows is executed through skin_scene3dtransition I assume it must be due to some difference between the two methods (but I still dont find a solution).

My code to generate the navigation arrow hotspots (they consist of the actual hotspot and a second hotspot below to simulate the shadow) and to hide the org hotspot looks as follows (positioning of the hotspots in space depending on the current view direction takes place in another function):

		for(let i=krpano.hotspot.count-1;i>0;i--) {
			const orghs=krpano.hotspot.getItem(i);
			if(orghs.style=="skin_hotspotstyle") {
			
				const orghsname=orghs.name;
				const arrowhsname="navarrow_"+orghsname;
				const shadowhsname="navarrow_shadow_"+orghsname;
			
				const arrowhs = krpano.addhotspot(arrowhsname);
				arrowhs.loadstyle("navarrowstyle_arrow");
				arrowhs.setvars({
					keep:false,
					heading: orghs.ath,  
					yoffset:0,
					onclick:"callwith(hotspot["+orghsname+"],onclick)"
				});
				
				const shadowhs= krpano.addhotspot(shadowhsname);
				shadowhs.loadstyle("navarrowstyle_shadow");
				shadowhs.setvars({
					keep:false,
					heading: orghs.ath,
					yoffset: 4					
				});
			
			    orghs.setvars({visible:false});
			};
		};

The heading and yoffset attributes are used internaly for the positioning of the hotspots in space (using tx, ty, tz) when the view rotates. I guess the keep attribute could be removed - I have only added it hoping it would solve my problem. The above piece of code gets executed on the onnewpano event.

The style for the hotspots is defined as follows:

	<style name="navarrowstyle_base" type="image"  distorted="true" zoom="false"  depth="0" scale="0.03"  rotationorder="xyz" rx="-90" ry="90" rz="0"/>
	<style name="navarrowstyle_shadow" style="navarrowstyle_base" url="navarrow_shadow.png" zorder="1000"  />
	<style name="navarrowstyle_arrow"  style="navarrowstyle_base" url="navarrow_white.png"  zorder="1001" />

Any hints would be greatly appreciated!

Stupid me, I have still been usinging version 1.20.9 without realizing it. After upting to the latest version it works as expected. Thanks für pointing me in the right direction.

And yes, Tuur is also right. The trace statement was worng to (bit it was just a sceondary problem).

Hi

Recently I have started to experiement with plugin development.

Getting the sample plugin code from the plugin interface page to work was easy, but when I tried to add my own code which should add some event listeners with krpano.events.addListener("onviewchanged",onviewchangedhandler) in the registerplugin function I cant get it to work.

Firefox always shows the following error message in the console: Uncaught TypeError: krpano.events.addListener is not a function

    local.registerplugin = function(krpanointerface, pluginpath, pluginobject)
    {
        // get the krpano interface and the plugin object
        krpano = krpanointerface;
        plugin = pluginobject;

		krpano.actions.showlog();
        krpano.trace(1, "registering plugin [" + plugin.name + "]");
		
		krpano.events.addListener("onviewchanged",onviewchangedhandler);
    }
   	function onviewchangedhandler(evnt) {
		krpano.trace("view changed");
	};

What is wrong resp. how can add listeners for the events in krpano.events (basically those that are available with <event xxxx="func()"/>) ?
I guess krpano.events is not fully initialized when I try to register for the event, but IDK how to work around this so I can add the listener later.

In the end, I want to build a plugin which sets some properties for the hotspots in the scene after loading (I gues that would be the onnewpano event) and which can also update some hotspot properties when the view changes.

Quote

Btw - in the next version 1.22, there will be improved and more detailed JS documentation and many more direct JS APIs.

I vould really appreciate this! In particular the docu.

Hi
I've just started to work on a new project with krpano. Since I found using the "normal" commands of krpano a bit troubling, I'am thinking about using javascript exclusively for the scripting.

I would call all krpano functions directly through the actions property that can be found in the root object. E.g. to create a hotspot the following code would be used:

var hotspot=krpano.actions.addhotspot("myhotspot");

In terms of coding this seems to be much mor comfortable to me, than going through the krpano.call method, which forces my to use a syntax similar to the "normal" krpano scripting.

Are there any downsides to this approach, apart from having no SWF support?

Thanks! This is Cool!
This sounds excellent. Will give it a try and hope to extend your code so I can pass in the name/id of the image instead of the index.

Small question:
Is there a way, how a hotspot could open a gallery in the scroll mode (large images) with a specific gallery image,
When galleries are opend like this, they always seem to open at the first image, but for my current pupose it would be necessary to open a specific image either based on its name (or if not passible otherwise based on its index). How can I achive this?

Just wanted to grab the latest version of the gallery, but it seem the downloadpage is down resp. cant be reached.