This plugin is completely free for use in any context or connection.
Current version: 1.0
Zip file
Test page with perspective spot
Plugin XML file
Test page with static spot
Test page with perspective spot
Plugin XML file
Test page with static spot
billboard.swf
VRSmarty hotspot plugin for making a slideshow.Scaling can be selected to make images fit any window size.
Every image can have its own:
| display time |
| transition type |
| onClick, onOver and onOut command |
| tooltip text |
Also works in a hotspot <box>.
Support for viewers to add their own images.
Controlled by a separate XML file.
The following parameters are supported:
In VRSmarty xml file:| xmlFile | xmlFile='ads.xml' | read plugin area data from this XML file, default=billboard.xml |
Plugin attributes:
| time | time=7.5 | Number (seconds), image display time (see NOTES) |
Plugin methods:
| play() | play() | start/continue slideshow |
| pause() | pause() | pause slideshow |
| next() | next() | show next image |
| prev() | prev() | show previous image |
| show('image_id') | show('ad5') | show image with id = image_id |
| addImage() | addImage() | add local image to slideshow |
Plugin external xml file:
| In <billboard> tag: | ||
| width | width="300" | billboard window width |
| or | ||
| width="20%" | width in percentage of pano width | |
| height | height="200" | billboard window height |
| or | ||
| height="25%" | height in percentage of pano height | |
| time | time="20" | image display time in seconds (default=20), |
| can also be set individually in <ad> tag | ||
| or be overridden by setting "time=nn" | ||
| autoPlay | autoPlay="0" | show billboard images at startup, default=1 |
| imageScaling | imageScaling="fill" | image scaling, "none", "fit" or "fill", |
| default: "fit", see NOTES | ||
| In <ads><ad> tag: | ||
| id | id="ad4" | optional id for use with the "show(id)" command above |
| url | url="img/advert_5.png" | image file url |
| time | time="30" | optional image display time in seconds |
| transition | transition="pressdown" | type of transition betweeen images (see below) |
| tooltip | tooltip="Visit Grand Hotel" | tooltip at image mouse-over |
| onClick | onClick="global.goHotel()" | VRSmarty command when image is clicked |
| onOver | onOver="global.showSpot()" | VRSmarty command at image mouse-over |
| onOut | onOut="global.hideSpot()" | VRSmarty command at image mouse-out |
NOTES: All tag names must be written in lower case, but attribute names are case independent (onClick is equal to onclick). Image fitting is determined by the imageScaling="..." attribute. Supported values are:
| none | no image scaling, image is shown as is |
| fit | image is scaled to best fit billboard window size, image proportions are kept unchanged |
| fill | image is scaled to fill the billboard window size, image proportions can be changed |
Setting image display time with "time=nnn" will override both the default and individual image display times until "time=0" has been received. Supported image transitions are:
| fade | new image fades in over previous image |
| pushup | previous image pushed up by new image |
| pushdown | previous image pushed down |
| pushleft | previous image pushed to the left |
| pushright | previous image pushed to the right |
| pressup | previous image pressed up by new image |
| pressdown | previous image pressed down |
| pressleft | previous image pressed to the left |
| pressright | previous image pressed to the right |
| coverup | previous image covered from bottom to top by new image |
| coverdown | previous image covered from top to bottom |
| coverleft | previous image covered from right to left |
| coverright | previous image covered from left to right |
| grow | new image grows from center |
| shrink | previous image shrinks into center |
If no transition is specified, one will be chosen at random.
Plugin commands or settings during a transition are delayed until current transition has been completed.
When the prev() or next() commands are used to show an image, the plugin will enter pause mode. The timer controlled slideshow may then be restarted by giving a play() command. All "press-" and "push-" transitions will also change direction: "pressleft" will be "pressright", "pushup" will be "pushdown" a.s.o.
A viewer can add his own images to the slideshow by using the addImage() function. To open the file select box, he has to click the text prompt due to the Flash Player 10 security policy.
Example of plugin xml file:
<?xml version = '1.0'?>
<?xml version = '1.0'?>
<billboard width="410" height="200" time="10" autoPlay="1" imageScaling="fill">
<ads>
<ad id="ad3" url="img/advert_3.jpg" transition="pressleft(2)" tooltip="Clicking this will open a new browser window" onClick="navigateTo('/panos/vrs/doc/','_blank')" />
<ad id="ad2" url="img/advert_2.jpg" transition="pushdown" tooltip="Clicking this will load another pano" onClick="goASS()" />
<ad id="ad1" url="img/advert_1.jpg" transition="coverright(2)" tooltip="This is image ad1" />
<ad id="ad4" url="img/advert_4.jpg" transition="pushup" tooltip="Clicking this will pan away a bit" onClick="pano.tweenPan=55|pano.tweenTilt=5" />
<ad id="ad5" url="img/advert_5.jpg" transition="grow" tooltip="This is ad #5" onClick="pano.tweenPan=-10|pano.tweenTilt=0" />
<ad id="ad6" url="img/advert_6.jpg" transition="fade(2)" tooltip="This is ad #6" onClick="pano.tweenPan=30|pano.tweenTilt=0" />
</ads>
<tooltip font="Comic Sans MS" textSize="11" textColor="#000000" bgColor="#FFFFF0" frameColor="#000000" />
</billboard>
Version history: