The widget is controlled through a combination of XML information stored on Topspin’s servers (the XML contains references to media content and system-level information) and dynamic variables passed in at load time called ‘flashVars’ (flashVars can override specific UI properties).
Email for Media flashVars
|halign||center||Alignment of the main elements in the widget (clickable button and call to action)|
|hpadding||8||Horizontal padding used throughout the widget|
|embedalign||center||The horizontal positioning of the “embed” icon|
|maxPhotos||50||The maximum number of pictures the Flickr engine will retrieve|
|displayInitialScreen||true||Whether the widget displays a call to action|
|langCode||en||two letter language code for internationalization|
|bgImage||null||location for static image to be placed as background wallpaper for widget (n.b. this image will not resize)|
|linkHasOutline||true||status of outline around main button|
|theme||black||general theme for the colors of the UI. The theme can be overridden by passing the following flashvars for the colors. Can be "black" or "white".|
|highlightColor||0x17CAFB||Most commonly used flashvar, since it will change the highlight color of all the action items in the player.|
|hideinfo||false||Optionally hide email opt-in icon which appears in the bottom right hand corner of the widget.|
|linkColor||0×17CAFB||Main highlight color for the widget|
|baseColor||0×000000||Background color for the widget|
|linkOverColor||0×000000||Color used to contrast with the linkColor (used mostly when an object colored with the linkColor is moused over)|
|fontColor||0xFFFFFF||Color of the font|
|errColor||0xFF0033||Color the font in the error message|
|twthash||null||set up a special twitter hashtag when tweeting from the widget. eg. twthash=#contest|
|imageVAlign||center||Vertical alignment of the image inside the widget. Possible values: top, center, bottom. Use imageVAlign=top in a taller widget so that your image does not get covered by the email input controls|
|crossfaderate||5||Slide show crossfaderate in seconds. Defaults to 5 second intervals|
|playMedia||false||Set to true to enable a Play button to show up and play the media include for the download. Note that this will only play a single track or video and should be taller that 100px for the button to render properly|
|smoothing||false||For pixelated images, set smoothing=true which will apply bitmap smoothing on any of the the images displayed. Note: Bitmap smoothing may make some images blurry so please use wisely|
Modifying the flashVars
Overall Widget Concerns
*All widgets are optimized for Flash Player 9.0.115, which is installed on over 98% of computers . We currently officially support Firefox, Safari, and IE7, although our products should work on Linux and other platforms as well.
Transparent Background on E4M Widget
To make the E4M widget transparent allowing the web page background to bleed through like:http://basecampmusic.com/
Two things must be added:
1. You must add the following to your embed code.
Disclaimer! By setting the wmode to transparent, it has been a known Adobe Flash Bug in FireFox (https://bugs.adobe.com/jira/browse/SDK-12420) , that international keyboards may not properly be able to enter the “@” symbol via the keyboard. The international user will have to copy and paste an “@” character into the text input field.
2. Add an additional flashvar: bgalpha=0
example for the above image:
Adding Streaming-Player Functionality to an E4M
You can easily add Streaming Player functionality to any E4M, simply by adding a line of code to the embed-code. When embedding the E4M, find the part of the code that reads: http://pastie.org/2357893After the quotation mark, insert the following snippet: http://pastie.org/2357896
See a screenshot of an E4M with this feature included:
The “play” button in the center streams all the tracks contained in the E4M. Hovering over the widget displays the bar on top, which shows the song title and progress bar, sharing options, and buttons that let the viewer browse the full list of songs, see info on the E4M, view the widget in Fullscreen, and mute the volume. The “Download Now” still button functions normally.