Drag and Drop Sample

One of the major features of the 0.98 release is the inclusion of drag and drop. Basically, this allows you to drag an Item into the 3D space where the IMML can decide to do something with it.

To try drag and drop out for yourself, first download generic-drag-drop-sample.imml (right-click, save as) and open in the Player.

Next, you’ll need to expand the Items list. Do so by clicking on this icon:

By default you are presented with the list of Items of type Video and Document that the currently logged in account has access to (these can be further restricted by the hosting server’s group ACL).

In this case as we are opening the file directly, it will default to showing the most recently published Items without filtering and should look similar to this:

Click to select one of the items from the list (in my example, I’ve chosen “VastPark Logo”) and drag it onto the 3D view. The large rectangle in the centre of the screen will change colour to blue indicating it is a drop target.

Next, drop the Item onto the blue rectangle, which will cause it to change colour to green. Shortly the VastPark logo will appear on it.

How does this work?

Behind the scenes is a plugin (called MetaforikAdapter) which currently supports adapting Items of type “Document” and “Video” to a Model or Primitive element. The code to do this is quite simple.

First, reference the Plugin:

<Plugin Enabled="True" Source="http://id.vastpark.com/VastParkWS/get.vpws?name=MetaforikAdapter&amp;publisher=craigomatic&amp;domain=vastpark&amp;context=park" Name="MetaforikAdapter">
    <Element Name="InvalidRequestHandler" />
    <Parameter Key="InvalidRequestEvent" Value="InvalidRequestHandler" />    
  </Plugin>   
  
  <Script Name="InvalidRequestHandler">
    function main(obj, args)
      scene.ui:writeline('invalid request')          
    end
  </Script>

Next, handle the appropriate events on the elements you want to be able to drop on. Alternatively, this can be at the document level:
<Trigger Event="DragDrop" Target="OnDragDrop" />
<Trigger Event="DragEnter" Target="OnDragEnter" />
<Trigger Event="DragLeave" Target="OnDragLeave" />

In you script for the drop, pass the Item along with the element you want to adapt it to into the load method on the plugin. You may choose to inspect the Item before the drop to give user feedback as is done in the sample IMML.

<Script Name="OnDragDrop">
    function main(obj, args)            
      --args.data contains the Item which was dragged in
      
      --load returns a controller object
      c = metaforikadapter:load(args.data, obj)      
    
      scene.ui:writeline('item name: '..c.item.name)
      scene.ui:writeline('id: '..c.id)
      scene.ui:writeline('is first: '..tostring(c.isfirst))
      scene.ui:writeline('is last: '..tostring(c.islast))
      scene.ui:writeline('total pages: '..tostring(c.pages))
      scene.ui:writeline('current page: '..tostring(c.currentpage))
    end
</Script>
  
<Script Name="OnDragEnter">
    function main(obj, args)
        scene.ui:writeline('drag enter on: '..obj.name..' of type: '..args.data.assets[0].type)     
    end
</Script>
  
<Script Name="OnDragLeave">
    function main(obj, args)
      scene.ui:writeline('drag leave on: '..obj.name)
    end
</Script>

Working with elements other than Document or Video

One thing to be aware of is that you don’t necessarily have to use the MetaforikAdapter plugin to benefit from drag and drop. If you want to allow for models or sounds to be dropped in, you can use the item.updateuri as the source for the element and add it into the scene, like this:

<Script Name="OnDragDrop">
    function main(obj, args)    
      item = args.data
      if(item.assets[0].type == 'Model') then       
          m = model()
          m.source = args.data.updateuri
      
          scene:add(m)     
      end
    end
</Script>

Final Note

That’s really all there is to it, you may want to craft different UI depending on the state of the controller properties in the MetaforikAdapter plugin sample, ie: to handle a multi-page document differently to a video or single page document, or in the model example to only allow certain users to drop models into a specific region of your space.

February 20, 2010 | Filed Under IMML, Plugins, Scripting | Leave a Comment 

Updated IMML for Stock Market Ticker

I’ve made some adjustments to the stock ticker built as part of my building a stock ticker in vastpark post to take advantage of the new Tooltip Plugin and the Define element in IMML. Rather than going all out, I’ve simply added a tip that shows the volume for the current day when the mouse is over one of the green bars and a Define that lets you more easily choose which stocks should be displayed.

If you haven’t already read the original article and are interested in how it works, be sure to have a read before continuing.

Define Element

The Define element is a declarative way of expressing a variable in IMML. It’s equivalent to doing element:set(‘variableName’, variableValue) but doesn’t require interpretation via the scripting engine which results in much better performance. It’s also a much nicer way to store global variables as they can be placed in more a easily identifiable location in the IMML rather than being buried within a script.

My Define in the sample looks similar to this (truncated for brevity):

<!--Use any Yahoo stock codes in the below define to control the stocks being generated and updated-->
 <Define Key="stocks" Value="IPL.AX,VIL.AX,FMG.AX,RIO.AX,BHP.AX,BOQ.AX" />

To change the ticker to show different stocks, replace any of the entries in the Value of the Define with the appropriate Yahoo ticker code for the relevant stock.

Tooltip Plugin

Note: To use the Tooltip plugin, you’ll need to be running either the most recent Player snapshot or version 0.98+ as it uses the Handle property that was added recently to the IRenderEngine interface.

The tooltip concept has been around for quite a while and is used by just about every modern desktop application. Ever wondered what that big red button does and hovered your mouse to find out? If yes, you’ve seen a tooltip. This plugin extends the concept to allow developers to associate a tip with an element in world.

To do so is quite simple, the following functions are provided with the plugin:

int Add(string text, ImmlElement element)
void Remove(int id)
void SetText(int id, string text)

To make use of these, I’ve added 2 lines to _updateStock in the UpdateStocks script:

--update the volume tooltip	
id = lastTradeVisual:get('tooltipId')
tooltipplugin:settext(id, 'Volume: '..volume)

…and 3 lines to _generateStock in the GenerateStocks script:

--store a define value on the last trade to represent volume for the tooltip
lastTradePrim:set('volume', volume)
id = tooltipplugin:add('Volume: '..volume, lastTradePrim)
lastTradePrim:set('tooltipId', id)

The end result still looks similar to before, but we now get tooltips when hovering:

Download the updated IMML here: stock-ticker.imml

February 17, 2010 | Filed Under IMML, Open Source, Plugins, Scripting | 1 Comment 

VastPark Platform 0.98 Released

Along with a fresh look for www.vastpark.com, the 0.98 versions of the Player, Creator, Publisher and Server have been released. This will be the final DirectX only version of the platform as we move towards 1.0

What’s included in 0.98?

Drag and Drop

Drag and Drop allows the user to drag an Item from the Items list into the 3D space. This Item can then be interrogated via script or plugin and an action can occur based on the developer listening to the DragEnter, DragDrop, DragLeave triggers in IMML.

The benefits of this can be extensive, from dynamic presentations with multiple presenters able to drag out their presentation on demand to injecting new content into the scene.

Note: This Items list is populated by the Metaforik index. You can get content into this index using the Publisher application (you must have a publisher account!) which supports Models, Video, Audio, etc, but currently doesn’t support the type “Document”.

Simplified UI

Feedback was received that the UI for the Player was a little complex, so we’ve introduced a menu and removed much of the clutter from the tray area. All of the functionality previously accessible from the tray is now found under the menu at the top of the application.

The address bar now has back, forward and refresh buttons as well as a new icon that indicates the health of the current document and an icon that appears when content is loading in the background.

The debug dialog has been slightly tweaked and simplified also, note that debug rendering options now appear under the menu View -> Render. By default, the LoadQueue tab is now displayed which is useful in working out what is occurring while you are waiting for a document to complete loading.

More of a focus on capture

Along with the support for Continuum capture, the Player now supports capture of screenshots.

Screenshot and Continuum captures default to being stored in your Documents folder under the subfolders “Continuum” and “Screenshots”. This can be customised by visiting the Options menu (Tools -> Options) and selecting a new capture path.

In a future release video capture support is likely to make an appearance as we aim to provide a variety of ways to capture the experience within the Player.

Search Syntax

Some slightly more advanced searching ability is included in the Player’s Item list and follows this syntax:

[type:itemType] [publisher:nameOfPublisher] [tags:tag1, tag2, etc]

Some valid searches that follow this syntax are:

Crate type:Model publisher:craigomatic
- Finds all Model items published by craigomatic that have a name like “Crate”

Crate
- Finds all items that have a name like “Crate”

type:Document
- Finds all items of the type Document

0.98 Platform Changelog

Download link: http://www.vastpark.com/resources/downloads.html

February 17, 2010 | Filed Under IMML, VastPark General | 2 Comments