The following parameters are supported:

In VRSmarty xml file:

xmlFile

xmlFile='myMenu.xml'

plugin control XML file, default=picmenu.xml

Plugin attributes:set with spot_id.content.name=value

xmlFile	xmlFile='myNewMenu.xml'	new plugin control XML file
size	size="124:500" size="50%:140" size="120:-30"	menu size, default=500:111 width/height can be set in % of pano width/height width/height can be set as pano width/height minus a value
imgSelected	imgSelected='p5'	set image as selected. Deprecated - use select().

Plugin methods: call with spot_id.content.name(value)

select(id)	select('pano3')	set image as selected
expand(sw)	expand(T)	0 or 1, anything else will toggle expanding can also be used at startup to set initial status
collapse(sw)	collapse(T)	0 or 1, anything else will toggle collapsing same function as expand, but inverted

Plugin external xml file:

In <picmenu> tag: Here you can specify menu attributes as size, position, colors...
size	size="124:500" size="50%:140" size="120:-30"	menu size, default=500:111 width/height can be set in % of pano width/height width/height can be set as pano width/height minus a value
scrollBar	scrollBar="0"	show scrollbar (default 1)
bgColor	bgColor="#CFCFC0"	menu background color, default=not visible
frameColor	frameColor="#000000"	menu frame color, default=not visible
showAtStart	showAtStart="1"	1: menu will show expanded at startup, default=0
menuHide	menuHide="manual"	never: menu always expanded manual: menu collapsed with arrow button auto: menu collapsed when thumbnail clicked - default all: visible will be set to 0 after clicking thumbnail
clickMode	clickMode="1"	0=clicking a selected thumbnail is ignored (default) 1=selected thumbnail can be clicked again
clickDelay	clickDelay="0.5"	delay (in seconds) after a thumbnail is clicked before a new click is accepted - to protect from double-clicks, (default=3)
In <choiceField> tag: These are attributes for the text box in which the name of the current pano is stored
visible	visible="0"	show field with name of chosen thumbnail (default 1)
width	width="140"	width of selected text field, default=#160
font	font="Comic Sans MS"	selected text font, default: Arial
textSize	textSize="11"	selected text font size, default: 12
textColor	textColor="#FFFFFF"	selected text font color, default: #FFFFFF
bgColor	bgColor="#FFFFFF"	selected text background color, default: transparent
frameColor	frameColor="#000000"	selected text frame color, default: no frame
text	text="Choose panorama"	initial text if no pano is chosen
In <tooltip> tag: Tooltips attributes (use this only if you want to display thumbnail tooltips)
font	font="Comic Sans MS"	tooltip text font, default: Arial
textSize	textSize="10"	tooltip text font size, default: 10
textColor	textColor="#FF0000"	tooltip text color, default: #000000
bgColor	bgColor="#FFFFFF"	tooltip background color, default: transparent
frameColor	frameColor="#000000"	tooltip frame color, default: no frame
In <id> tag: Thumbnail id attributes (use this only if you want to display thumbnail id)
font	font="Comic Sans MS"	id text font, default: Arial
textSize	textSize="24"	id font size, default=32
textColor	textColor="#FF0000"	id font color, default=#000000
salign	salign="BC"	id alignment within thumbnail, default=MC
In <images> tag: Contains attributes that are valid for all thumbnails
size	size="100:67"	thumbnail size, default=100:67
frameWidth	frameWidth="2.5"	width of thumbnail frame, default=3
frameColor	frameColor="#FFFFF0"	color of thumbnail frame, default=menuBgColor-0x808080
mouseFrame	mouseFrame="1"	frames the thumbnail at mouse-over (default 1)
mouseAlpha	mouseAlpha="0"	sets thumbnail alpha to 1 at mouse-over (default 0)
mouseScale	mouseScale="1"	increases thumbnail scale at mouse-over (default 0)
showId	showId="1"	show thumbnail id, default=0
showText	showText="tooltip"	specifies how to show thumbnail text; below=below thumbnail,
		tooltip=as tooltip, never=don't show text, default: below
font	font="Comic Sans MS"	thumbnail text font, default=Arial
textSize	textSize="10"	thumbnail text size, default 10
textColor	textColor="#404040"	thumbnail text color, default #FFFFF0
textOnTop	textOnTop="1"	keeps text on top of thumbnail at mouse-over
textVSpace	textVSpace="10"	extra vertical space between thumbnail and text
extraVSpace	extraVSpace="8"	extra vertical space below text, default=0
In <image> child tag: You should have one <image> tag for each thumbnail
id	id="p12"	image id (optional), used as reference in the select() command
text	text="Train Station"	thumbnail text
url	url="pics/pano8.jpg"	thumbnail url
onClick	onClick="global.goPano2"	thumbnail onClick command
onOver	onOver="pic3.visible=1"	thumbnail onOver command
onOut	onOut="pic3.visible=0"	thumbnail onOut command
selected	selected="1"	thumbnail selected at start

NOTES:
The menu thumbnails can be oriented horizontally or vertically, depending on the width and height values. So, if menu height is greater than menu width, the thumbnails are stacked vertically.

There are three ways to specify menu width or height:

1. As a fixed pixel value: size="124:500"
   The menu will keep this size when the pano is resized.
2. As a percentage: size="50%:140"
   The menu will change size when the pano is resized. In this example the menu will always occupy 50% of the pano width. When the setting is 100%, margins will be deducted from menu width/height.
3. As a fixed negative value: size="-30:120"
   The menu will change size when the pano is resized. In this example the menu width will be pano width - 30px.

When the menu is centered (horisontally or vertically), left/right or top/bottom margins will be equally wide even if they are set to different values.

Menu scrolling is of course handled by the scrollbar, but can also be done by positioning the mouse near the menu endpoints.

The selected thumbnail is always framed.

Thumbnail texts can contain newline ("\n") codes to make it span over several lines. When using horizontal mode, you have to set the "size" parameter accordingly to make the text fit. And only the first line will be shown in the selected text box.

You can choose whether the thumbnail text is to be shown below thumbnail, in a separate tooltip box or not shown at all. You can also select separately if you want the thumbnail id to be shown over the thumbnail. If no thumbnail id is specified, it will be set to its sequence nr.

As you can't use the &;=| characters in the XML file, you have to encode them as follows:

The thumbnail mouseOver effects can be used in any combination.

The select(id) command can be used at any time to select an image. If a new pano is selected by any other method (the Google map plugin, for example), you can update this parameter from VRSmarty ("spot_id.content.select('xxx')") and the plugin will select and scroll to image with id="xxx". If image id is not specified, use image number starting with 1. Using this command will only select the thumbnail - not execute its onClick command.

If you want to make the text under the thumbnail more visible at mouse-over, you can try using one of the textOnTop or textVSpace attributes in the <images> tag.

After clicking a thumbnail there is a 3 seconds delay before further clicks are accepted. Furthermore, if a new pano is being loaded, thumbnail clicks are ignored until loading is complete.

Example plugin XML file:

<?xml version = '1.0'?>
<picMenu
   size="100%:121"
   scrollbar="1"
   bgColor="#404050"
   frameColor="#000000"
   showAtStart="1"
   menuHide="auto"
>
   <choiceField 
      visible="1"
      width="160"
      font="Trebuchet MS"
      textSize="11"
      textColor="#FFFFF0"
      bgColor="#404050"
      frameColor="#000000"
   />
   <images 
      size="100:67"
      mouseFrame="1" 
      mouseAlpha="1" 
      mouseScale="1" 
      font="Trebuchet MS"
      textSize="11"
      textColor="#FFFFF0"
      textOnTop="1"
      textVSpace="10"
      frameWidth="3"
      frameColor="#FFFFF0"
   >
      <image id="p1" text="City Hall Tower" url="/panos/images/thumbs/cityhall.jpg" onClick="goTower()" onOver="p1.visible=1" onOut="p1.visible=0" />
      <image id="p2" text="City Hall Yard" url="/panos/images/thumbs/cityyard.jpg" onClick="goYard()" onOver="p2.visible=1" onOut="p2.visible=0" />
      <image id="p3" text="The %C5rsta Bridge" url="/panos/images/thumbs/pano3.jpg" onClick="goArstaBridge()" onOver="p3.visible=1" onOut="p3.visible=0" />
      <image id="p4" text="Maria Hill" url="/panos/images/thumbs/maria.jpg" onClick="goMariaHill()" onOver="p4.visible=1" onOut="p4.visible=0" />
      <image id="p5" text="%C5SS Boat Club" url="/panos/images/thumbs/ass.jpg" onClick="goASS()" onOver="p5.visible=1" onOut="p5.visible=0" />
      <image id="p6" text="The Boat Club" url="/panos/images/thumbs/yachtclub.jpg" onClick="goYachts()" onOver="p6.visible=1" onOut="p6.visible=0" />
      <image id="p7" text="Hammarby Gates" url="/panos/images/thumbs/hammarbyslussen1.jpg" onClick="goGates()" onOver="p7.visible=1" onOut="p7.visible=0" />
      <image id="p8" text="Skanstull Marina" url="/panos/images/thumbs/arstaviken4.jpg" onClick="goSeasons()" onOver="p8.visible=1" onOut="p8.visible=0" />
      <image id="p9" text="The Train Bridge" url="/panos/images/thumbs/arstaviken7.jpg" onClick="goUnderBridge()" onOver="p9.visible=1" onOut="p9.visible=0" selected="1" />
      <image id="p10" text="Small bridge" url="/panos/images/thumbs/arstaviken8.jpg" onClick="goSmallBridge()" onOver="p10.visible=1" onOut="p10.visible=0" />
      <image id="p11" text="Torkel Knutssonsg." url="/panos/images/thumbs/torkelknutsson.jpg" onClick="goTorkel()" onOver="p11.visible=1" onOut="p11.visible=0" />
      <image id="p12" text="%C5rsta Train Bridge" url="/panos/images/thumbs/arstabron11.jpg" onClick="goArsta12()" onOver="p12.visible=1" onOut="p12.visible=0" />
   </images>
</picMenu>
					

Version history: