Shared Media

Started ‎02-24-2011 by
Modified ‎02-26-2016 by

 

Adding shared media to an object

You can add web-based media content to the surface of any objects you are allowed to modify. To add media to an object:

Using the build tools

  1. Right-click the object and choose Edit.
  2. Choose Select Face in the build tools window.
  3. Click one face of your object. For example, if your object is a cube, click the side of the cube on which you wish to display your media.
  4. Click the Texture tab of the build tools window.
  5. Click the Materials dropdown and choose Media.
  6. Click the Choose button.
  7. In the General tab of the Media Settings window, enter your media's URL in the Home Page field.
  8. Click Apply, then OK.
  9. Close the build tools window.
Important: Make sure to apply your media to only one face of the object! Rendering the same media multiple times can needlessly cause severe performance and bandwidth problems for Residents who view your object.

Drag and drop

You can also drag and drop URLs and favicons from your favorite web browser onto a prim to add Shared Media.

File:Shared Media Drag and Drop.png

More about this feature is shown here.

 

Next steps

To start viewing your media, click the media-enabled surface of your object once. A set of media controls appears, and your media loads. From this point forward, you can interact with your media as though you are viewing it with a standard web browser.

Tip: To use Flash, popularly used in a wide variety of media from YouTube to interactive games to collaboration webapps, you need to download and install Flash.

 

Showing shared media at the correct aspect ratio

Shared Media is setup to show square media. However, you can change this to fit any aspect ratio.  There are three key things you need to know:

  1. The media's exact dimensions in pixels.
  2. The offset alignment of the media — calculated with an Align button.
  3. The aspect ratio of the media — easily calculated using a tool, as we'll see.

 

What works?

Content that can undergo this process includes but is not limited to:

  • Direct links to a supported image type, like an animated GIF, JPG, or PNG.
  • Rich interactive media like Flash that's isolated on a page.
    • This technique is likely to fail if there's a page with a Flash media embedded in the middle of whole bunch of other stuff, but usually works if the Flash media is the only thing on the page.
  • data: URIs that fall under the above. data: URIs save you time by letting you show content without having to upload a webpage to a server.

Watch this easy video tutorial to see how it all works in action, then as-needed, follow the text steps below:

Finding and applying the media's dimensions

First, view the media in an external web browser.

  • If it's an image, most browsers show the size in pixels (like 500x375) in the title bar.
  • If it's Flash media or something else, try viewing the page source (usually available as a context menu option if you right-click the page). Try this example and look for where it says height="433" width="720". Specified dimensions are highly typical in Flash media embed code.

Once you have those dimensions, in the Second Life Viewer:

  1. Right-click the object and choose Edit.
  2. In the Build Tools window that appears, click the Texture tab.
  3. Click the Select face radio button and click the face of the object where your media is displayed
  4. Click the Choose button.  The Materials/Media dropdown must be set to Media in order to see this button.
  5. Under the Media Settings window's General tab, uncheck Auto Scale Media on Face of Object.
  6. Enter the exact size in the Size fields.
  7. Click OK.
Note: If you later re-enable Auto Scale Media on Face of Object, it uses your defined Size as a starting point.  Therefore, if you set a very small Size, Second Life attempts to properly scale your media's aspect ratio using that small size.

 

Aligning the media

This is easy. Back in the Texture tab of the Build Tools window, click Align. The media aligns itself to "hug" the full face of the prim. If it doesn't, there may be elements on the media's source page that interfere with positioning.

 

Entering the aspect ratio

In your web browser, do a pixels-to-meters conversion:

  1. Open a calculator such as the Aspect Ratio Calculator or the Continuum Javascript Ratio Calculator.
  2. In one set of boxes, enter the pixel dimensions of the media you used earlier.
  3. In the other set of boxes, enter one of the desired dimensions of the object. The calculator gives you the other number.

Back in the Viewer:

  1. In the Object tab of the Build Tools window, enter that second set of metric numbers. The object resizes and the media should appear at the right aspect ratio without undesired squashing or stretching.

If you're interested in tweaking your content futher, you could make a Shared Media template.

 

Navigating shared media

Some objects in Second Life can display web-based media content, much like a common web browser. If you are already comfortable browsing the web, Shared Media controls should be easy to learn.

 

Trying out Shared Media navigation

  1. Find a media-enabled object. These objects are easily identified by the media controls that appear when your mouse cursor moves over them. You can also use one of your own media-enabled objects.
  2. Click the media once to give it focus. You must click the media itself, and not another part of the same object.
  3. Notice the navigation controls that appear:
    • File:Shared Media Web Controls.png
    • Back and forward buttons: Cycle through previously visited pages.
    • Home button: Returns the media to this object's home URL.
    • Refresh/stop button: Reloads the current page or stops the loading of a page that is in progress.
    • Address bar: Navigate to any URL by typing it into this bar.
    • Magnifying glass/right arrow button: The magnifying glass automatically positions your camera in front of the media, then changes to the right arrow button, which returns your camera view to your avatar.
    • Window button: Opens the current URL in an external web browser.
  4. Try visiting several of your favorite websites to get a feel for how web content is presented in Second Life. Any web pages you view are fully interactive, meaning you can click any links and type into any text fields you see!
Note: The creator of a shared media object can disable navigation controls and keyboard and mouse interactivity on it.
Comments
by Senior Helper
on ‎05-24-2011 08:18 AM

1. See the paragrahp about "Drag and drop". The link "shown here" goes to the general Inworld blog, and don't goes to the specific thread: https://blogs.secondlife.com/community/community/tnt/blog/2010/03/04/viewer-2-tip-drag-websites-to-s...

2. See the paragraph about "Next steps". The link "interact with your media" goes to this same KB article.

3. See the paragraph about "What works". See the phrase "This page presumes you already know how to add Shared Media to an object". The link "add Shared Media to an object" goes to this same KB article.

4. See the paragraph about "Entering the aspect ratio". The link "Shared Media template" goes to the general Inworld blog, and don't goes to the specific thread: https://blogs.secondlife.com/community/community/tnt/blog/2010/03/29/viewer-2-tip-shared-media-templ...

5. See the paragraph about "Trying out Shared Media navigation". The link "create one of your own" goes to this same KB article.

6. See the last "Note". The link "create your own fully permissive Shared Media object" goes to this same KB article.

by Linden
on ‎06-13-2011 08:25 AM

Thank you both for your help with this! I've updated the external links & eliminated the redundant internal ones (which seem to be the result of merging two separate articles at some point in the past).

by Senior Helper
on ‎06-13-2011 09:12 AM

You're welcome :)

by Advisor Vick Forcella
on ‎05-31-2012 02:30 AM

I have uploaded to the wiki an Icon that can be placed on the prim side that displays shared media. It will be shown to the people that have shared media disabled.

by Contributor Cerise Sorbet
on ‎09-07-2013 08:15 AM

In the "Finding and applying the media's dimensions" section, step 4 has changed since materials were added.


4. Below the Color box, use the pull down menu to switch from "Materials" to "Media". Press the "Choose..." button.

 
Contributors