« January 2009 | Main | March 2009 »
February 23, 2009
Brightcove News: NYC Meetup, Python Library, and More
As I mentioned last week I'm going to try to group together the Brightcove and video news I find and post it a bit more regularly. Well, the news has been overflowing, so it's time for another post.
NYC Meetup: Want to see me and other Brightcovians in New York? We'll be there on March 13th.
Brightcove API in Python: StudioNow created a Python library for the Brightcove API. It's exciting to see projects like this grow organically for Brightcove.
And PHP and Javascript: Speaking of the APIs, Brian Franklin and Matthew Congrove created wrappers for PHP and for JavaScript.
Jeremy Allaire's new blog: Jeremy Allaire has a new blog which already has a lot of long and insightful posts on it. You can ready about the difficult economics of long tail video and whether online video is a cost center.
Brightcove A-Twitter: Brightcove is twittering. You can subscribe to Brightcove, Jeremy, and I'm sure others.
Tremor Gets $18M: Tremor, the advertising network that Brightcove uses for the Brightcove Basic edition raised $18M in funding.
Advertising articles: Last but not least, you can check out some articles I wrote on the developer center. The Brightcove Advertising SDK gives a good technical overview of the Brightcove advertising system. Ads and Custom Player Templates explains how to use custom BEML and ads. Player Logging gives tips on figuring out advertising problems in a Brightcove player.
February 22, 2009
Fighting Brain Crack: Goodbye swclibrary.com
I read John Wilker's post on fighting brain crack, getting rid of the ideas that stick around in your head forever even though nothing is done with them. Immediately one thing came to mind: swclibrary.com
I registered this domain name, along with swclib.com, in October of 2005. I was working on the Flex team at the time, and my development of compc and asdoc led me to see the need for a good component site for Flex. I was envisioning something like ScaleNine (which wasn't around yet) for SWCs.
Through the years, I've held on the domain name and some notes on the idea. And through the years, other components sites have come along:
- FlexBox, which isn't being updated anymore but which still brings in a surprising number of hits to my blog for the HTML component.
- Adobe Flex Exchange , which has a grab-bag of components, themes, and applications.
- FlexLib, which isn't really a component site but a group of open source components that a lot of people use.
- The flex.org component site, which probably has the best list but which needs some interface love.
None of the sites felt quite right to me, so I kept the idea around. Then another big change to Flex got me thinking about it again, as the Gumbo component model will bring about a whole new set of components.
I still had it somewhere in my head when I recently saw Jeffry Houser's FlexTras, but the idea is so far back there that the idea didn't move an inch.
So it's time to come clean with myself. My off-work computer time has been full of Brightcove dabbling or blogging, and I plan to keep it that way. The domain names won't be renewed, I'll delete all my notes, and I'll keep fighting the good fight against brain crack.
February 16, 2009
Creating a Video Player with BEML
Recently I wanted to create a player to show a Caiman, Scarlet Macaw, and other animals from Costa Rica. The default players that could be used with Brightcove didn't look quite right for what I wanted to do, and so I had my first real need to use BEML for a custom player.BEML is the XML syntax that's used to create a template that's used to create a Brightcove player. The BEML syntax will look familiar to Flex users, as there is a Canvas, VBox, HBox, Label, and many other similar components. One big difference with BEML is that it is interpreted at runtime, which means it's a bit simpler in it's language constructs, but this allows Brightcove to provide quick previews and good caching of players.
The player I wanted to create needed to display a long description below the video. None of the default templates had a really large place for text, but it looked to me like one of the existing templates could be altered for my use. So I went went into the publishing module, clicked on All Templates, and then clicked on Duplicate for the Compact Tabbed Navigation 3.0 template.
I then saw the BEML for the copied template, which I could then alter.
I first changed the height in the BEML so that the player would be taller. I didn't know exactly how much long description space I would need on the bottom, so it's probably too large, but that doesn't matter if the player is only being viewed on its own page. To change the height, I changed:
<Layout id="application" width="798" height="603" boxType="vbox"
padding="6" gutter="4">
to:
<Layout id="application" width="798" height="703" boxType="vbox"
padding="6" gutter="4">
I decided I would use the Long Description field for each video, which can be edited in the media module, to display the text that I wanted. So I replaced the existing reference to the Short Description in the BEML to refer to where I what I would really edit for each video. I changed:
<Label height="52" multiline="true"
text="{currentItem.shortDescription}"
truncate="true"/>
to:
<Label height="52" multiline="true"
text="{currentItem.longDescription}"
truncate="true"/>
The last change I made, and the most important change, was to remove the existing XML for the template that was below the video. I only wanted the title, long description, and link in this spot. So I changed:
<VBox gutter="15">
... skipping the XML in here, which includes a TitleLabel,
Link, ExpandingBanner, and much more
</VBox>
to:
<VBox>
<TitleLabel height="24" width="765" id="videoTitle"
text="{videoPlayer.video.displayName}"
selected="true" size="18" truncate="true"/>
<Label height="88" width="765" multiline="true"
id="longDesc" text="{videoPlayer.video.longDescription}"
size="18" truncate="true"/>
<Canvas>
<Link x="1" y="-5" size="10" id="relatedLink"
text="{videoPlayer.video.linkText}" vAlign="bottom"
url="{videoPlayer.video.linkURL}"/>
</Canvas>
</VBox>
With the BEML changes made, I could preview and see that I had the template that I wanted.
I played around with the BEML for awhile, but the whole process still took less than an hour. It was a lot more time consuming to edit the videos and come up with the descriptions. After the template was created, I created a player from the template, made all the changes in the media module for the videos, and saw the results of my work.
I had fun creating the player, which was some good eating of dog food. If you'd like to learn more about BEML, I would start at Customizing Players with BEML in the Brightcove documentation. And if you'd like to see me almost step on a poisonous snake, you can look here.
Update: check out Jeremy Allaire's post for more details on BEML.
Update2:Here's the full BEML from my example:
<Runtime>
<Theme name="Deluxe" style="Light">
<Style id="default"><![CDATA[.titleText {fontSize: 12;}
.bodyText {fontSize: 10;}.linkText {fontSize: 10;}]]></Style>
</Theme>
<Layout id="application" width="798" height="723" boxType="vbox"
padding="6" gutter="4">
<HBox height="40" vAlign="bottom" gutter="9">
<Image id="logo" width="300" scaleMode="scaleDown"
hAlign="left" vAlign="bottom"/>
<TabBar id="playlistTabs" height="22" tabAlign="right"
hideSingleTab="true"/>
</HBox>
<HBox height="406" gutter="6">
<VideoPlayer id="videoPlayer" width="480"
video="{videoList.selectedItem}"/>
<List id="videoList" rowHeight="78" automaticAdvance="true"
data="{playlistTabs.selectedItem.videoDTOs}"
selectOnClick="true" itemInsetV="4" itemLeading="2">
<ListItem boxType="hbox">
<Spacer width="8"/>
<VBox width="80" height="74" vAlign="middle">
<ThumbnailButton height="60" data="{currentItem}"
source="{currentItem.thumbnailURL}"/>
</VBox>
<Spacer width="7"/>
<VBox>
<Spacer height="3"/>
<TitleLabel height="18" text="{currentItem.displayName}"
truncate="true"/>
<Label height="52" multiline="true"
text="{currentItem.longDescription}"
truncate="true"/>
</VBox>
<Spacer width="3"/>
</ListItem>
</List>
</HBox>
<VBox gutter="15">
<HBox height="102">
<Spacer width="6"/>
<VBox>
<TitleLabel height="24" width="765" id="videoTitle"
text="{videoPlayer.video.displayName}" selected="true"
size="18" truncate="true"/>
<Label height="72" width="765" multiline="true"
id="longDesc"
text="{videoPlayer.video.longDescription}" size="18"
truncate="true"/>
<Canvas>
<Link x="1" y="-5" size="10" id="relatedLink"
text="{videoPlayer.video.linkText}" vAlign="bottom"
url="{videoPlayer.video.linkURL}"/>
</Canvas>
</VBox>
</HBox>
</VBox>
</Layout>
</Runtime>
Posted by Brian at 12:34 PM
February 15, 2009
Flex 4 Compiler Speed
The piece that I've been most excited about in Flex 4 is the faster Flex compiler. So I was interested to see Enrique's post on some of the speedups. To quote, "The performance test suite went from full compiling in four minutes with Flex 3 to two minutes with Flex 4." I expect it to be even faster when the final version is done, and this will be immensely helpful to large projects, like the ones I work on at Brightcove.
Another article on the subject in the Notes on Compiler Improvements from the Gumbo specs. It's a low-level look from a compiler guru at Adobe who's looking into how to speed up the ActionScript compiler. Most of it won't be of interest if you haven't looked into the compiler source code, but the graphs at the end provide some insight into the progress.
For some Flex 3 compiler information on this blog, you can check out A Faster Flex 3 SDK and Flex Compiler Resources.
February 10, 2009
Brightcove News: iPhone Support and Other Examples
Rather than my occasional blog post on a Brightcove news item, I'm going to be trying to group together and post more about Brightcove, especially info for developers. For the Flex readers out there who don't want the Brightcove news, you can always subscribe to the Flex-only feed. But then you'll be missing out some random Flash and video development goodness that you should read, in my completely-biased opinion.
iPhone support: Brightcove released a page on iPhone support, including example files and a live demo. Given that H.264 has been supported by Brightcove for awhile, this could have been done earlier by customers, but the HTML and JS files make it a lot easier.
Code! I'm not sure how I missed Bob de Wit's blog until now. Bob is a consultant for Brightcove in Europe, and his blog has a lot of great Brightcove examples, like subtitling and using a player in Flex.
Get a reply from Jeremy Allaire: The Brightcove community forums are getting a lot of traction, and you'll see pretty much everyone from Brightcove on there. There's answers from the developers, support, architects, and everyone else at Brightcove (including BC-JAllaire).
