Syndication Panel Translations
We have created translated versions of the syndication panel for Action Script 3.0 (Flash CS3+) users (our AS2 API already contained this functionality). Make sure you grab the latest version of our AS3 API to take advantage of this. You can set the language using widget.syndication.setLang(language:String). Here the "language" parameter corresponds to the standardized language code for the given language. There are also two localized versions of English, for American and British English respectively. You can see the list of supported language codes in the code below. You can also retrieve a String of the language code using widget.syndication.getLang(). The current language is also stored inside the Flashvar/setting "lang".
Please let us know if you find any translations that are incorrect in the syndication panel!
New Facebook Actionscript Libraries
We have replaced our other Facebook dynamic library with the new apis that can be found here:
http://code.google.com/p/facebook-actionscript-api/
What does this mean as a yourminis developer?
For an example of how to set up a widget with the dynamically included facebook library, look here:
http://www.yourminis.com/developers/tutorials/as3/facebook.aspx
We are still working out some kinks so bear with us until we get this fully stabilized, but let us know in the developer forums what issues you are having. At this time we only recommend using this library to connect while the widget is actually residing on Facebook, but feel free to experiment!
We have implemented a new (optional) way of exposing the syndication panel. You will now have the ability to show destination sites for your widget on the front of your widget. A menu bar can be aligned to the top or bottom of your widget to show these locations. The benefit of this menu bar is that it allows one less click, and can show the most important destinations (as you choose) up front. Implementing this feature is very easy -- once your widget is initialized, you simply call widget.syndication.initOverlay(), as shown below:
As you can see, you can pass in a list of strings for destinations that you want to appear on the menu. Here is a full list of the possible strings you can use:
If you would like to customize the appearance and alignment of this component, you can call widget.syndication.styleOverlay(), as show below:
That's it! You can view an example of the "Sliver" syndication panel here.
In this example we will show you how to use our SkinList component, which allows you to display a list of items with content laid out as you specify. The SkinList is very customizable, and because of this it may appear a bit complicated at first, but it is not difficult to learn how to use. As usual, first download, unzip, and link your classpath to the Component Library. You can view an example of this component here, and download the FLA here. Because this example relies partially on library symbols, for ease of skinning the list, you cannot simply cut and paste the code below, you must download the aforementioned FLA.
As you can see, the parameters for the constructor have been commented out for you, but just to make a few clarifications...two of the parameters, "_cellType" and "_scrollType", are classes. Here, we link to classes that are exported out in the Library Panel ("cell" and "scrollbar"). This allows us to edit these symbols within Flash, rather than hand-coding every aspect of their appearance as an ActionScript Class. Also, when you construct the SkinList you pass in an array of data (the "_dataArray" parameter), just like with the YMVideoContainer. However, this data array can be more complex than a list of strings -- in fact it can contain any kind of data in the array elements, from Objects to integers to Strings. This is because you actually configure how each cell handles the data, which we will cover below. Like many of the other components, there is a setSize(w,h) function that allows you to resize the list -- here the size represents the total size of the list, scrollbar included. If you open the library item "cell" by double clicking on it, you will see the code below, as well as the various graphical elements of the cell.
You can completely customize the contents of this cell, the only thing that is required is that you implement the five functions below (they can be empty, but the functions should at least exist). A description of each function is included as well.
onInit(_par, _index, _data) -- This is called when the list is intialized. It gives you an opportunity to set up the contents of the cell, as well as set up variables linking to important data. "_par" will give you a reference to the parent of the list, or whatever you pass in to the "_parent_mc" parameter when constructing the list. This is useful for calling functions not defined inside each cell (in this case, when a cell is clicked, "parent_mc.myFunction(index,data.description);" is called). The "_index" parameter gives you access to the index of the cell, which corresponds to its position in the list. The very top cell has an index of 0, the one below it 1, the one below that 2, and so forth. The last parameter, "_data", gives you an item from the _dataArray that you pass in when constructing the SkinList. So, for example, if its the first cell in the list, it will pass in _dataArray[0] as the _data parameter here.
onResize(w,h) -- this is called whenever SkinList.setSize(w,h) is called -- it will pass in the appropriate width and height to you, based on whether or not the scroll bar is visible, and you can resize your cell contents accordingly. Here we use a special function called textFit() to fit the text to each cell so that if it is cutoff an ellipsis appears ("..."). Text fit takes an array of String/Number pairs, each number represents the average width of a character in the string. If the number is 0, it ensures that the string does not get cut off at all. The textFit() function is not required, but you are welcome to use it to make your text look more well formated.
onOver(evt:MouseEvent) --This is called whenever the user hovers over a cell with their mouse. Here is a good place to turn on a highlight of some sort for interface/user feedback.
onOut(evt:MouseEvent) -- Likewise, this function is called whenever the user's cursor leaves a cell - this is a good place to turn off any sort of highlight you have implemented
onClick(evt:MouseEvent) -- This function is called when a user clicks on a cell.
It is easy to edit the appearance of any element inside the cell or scrollbar. To edit the cell, open "cell" in the Library panel and double click on one of the elements -- you can then change its color by selecting the shape then using the color picker to pick a new color. This can be done for any of the elements, you can also adjust opacity or add effects like bevels or drop shadows. Note that the cell is completely customizable, and you can get rid of all these elements entirely and insert new ones -- however, you must update the code in this Symbol to reflect your changes. The scrollbar is not like this, the symbols must remain named as they are, and nested in their current positions. However, you can changed the colors and effects applied to the scrollbar. Double click on the scrollbar symbol in the Library Panel to open it. Inside the scrollbar, any symbol named "over" is the highlight that appears when a user hovers over that element of the scrollbar. These symbols will be invisible until the user hovers over, and then they will disapear again when the user hovers out.
That covers it! On the surface, this class may appear a bit complicated because there is a lot of code that goes into creating a customizable list. However, it should be fairly easy to tailor the list to your needs, just experiment a little bit if you curious what a particular item does. As usual, you can visit the yourminis Developer Network if you have any questions, and I will be happy to help you out.
We have decided to open up our component library to users -- normally we use this library internally to develop widgets, but we thought you would find it useful as well. There are a lot of components for you to explore; at the moment documentation is very sparse, but we will be improving this with time, in addition to other aspects of the library. Also, we will be providing examples of these components in action, and short tutorials on how to use them. You can download the yourminis Component Library here. You will want to make sure that your classpath ("File"->"Publish Settings"->"Flash [tab]"->"Settings...") includes a link to where ever you extract the yourminis Component Library to.
The first component we will be showing is the ImageLoader utility,
which allows you to load images, frame them, and resize them
proportionately (so that they don't skew when resized). You can view a widget using this component here. You can download the sample FLA here or grab the code from the code box below.
As you can see, after the widget is initialized in the "onWidgetLoaded" event handler, a new Sprite is created ("im_mc") to hold the ImageLoader. This isn't required but it allows you more control over placing the ImageLoader before it is initialized, and allows you to easily dispose of the ImageLoader and create a new instance of it if you want to reload an image into it or change the way it is constructed.
A description of all the parameters for the constructor of the ImageLoader is provided in the code. The "setSize(width,height)" function allows you to set the size of the image loader. Note that we check if the instance "il" of the ImageLoader is defined before calling any function, as it is possible the user could remove the imageLoader object in their code if they were to dispose of the image.
The ImageLoader allows you to load images pretty easily, but what if you want to load movies? Our next component sample will show you just how to do that.