Elements: library and media

Before using picture and other elements, you will need to tell Calaméo where to find them.
Skin elements can be loaded either from Flash SWF libraries or medias like PNG, JPEG and GIF files.
It is done with the following statements:

<library name="lib" source="http://www.myserver.com/calameo/my-library.swf" />
<library name="otherlib" source="http://www.myserver.com/calameo/my-other-library.swf" />
...
<media name="mylogo" source="http://www.myserver.com/calameo/my-logo.png" />
<media name="mycanvas" source="http://www.myserver.com/calameo/my-canvas.jpg" />

The library statement is used to load an SWF file, in which multiple graphic elements are referenced by an unique ID.
The media statement is used to load a PNG, JPEG or GIF file, which can be a standalone image or a bitmap canvas.

Attributes

Attribute Description
name A string which will be used to reference the preloaded element
source The absolute URL where the flash or pictuire file is located.

Using a flash Calaméo Skin

Once your skin is loaded, reference it as such:

<button action="zoom" tooltip="no" upState="myFlashCanvas#btnZoomOn">
myFlashCanvas references the loaded library, btnZoomOn is the export name (class) previously chosen.

Using a bitmap canvast

The CSML code to extract an image is real simple:

<button action="zoom" tooltip="no"
	upState="mycanvas#0,0,35,35"
	overState="mycanvas#0,35,35,35"
	disabledState="mycanvas#0,70,35,35"></button>

Let's have a look at overState="mycanvas#0,0,35,35":
mycanvas refers to our bitmap file previously loaded by means of a media tag
The four coordinates are: