Developer Blog

App Categories Coming in 1.2

If you’ve logged into your Developer Dashboard today, you’ve noticed a new management feature for your apps. With the upcoming 1.2 release for the Boxee Box, we are going to be introducing new Categories for apps. Up until now, apps have been categorized solely by Video, Photo, and Music. With 1.2, we’ll be helping navigate our exploding library of apps with a whole mess of new categories, including:

  • Adult
  • Education
  • Entertainment
  • Film and TV
  • Gaming
  • Kids
  • Lifestyle
  • Live
  • Music
  • News
  • Photo
  • Sports
  • Social
  • Tech

You don’t have to adjust anything in your application to get ready for this new release. Just log in to your Developer Dashboard, click on Apps, select the app you wish to categorize, and choose three from the list above.

1.2 drops in a few weeks, so get your apps categorized with a quickness!

June 30, 2011 at 11:25 am

Miso Announces Dev Contest For Social TV Developers

The fine folks over at Miso have announced a developer competition and are extending a warm invitation to the Boxee family to compete. Miso serves up a piping hot social TV platform for checking into your favorite shows, earning points and badges while discovering what fun stuff your friends are watching. We share a lot of users in common and now they’re rolling out the red carpet to our development crew to kick out some tight social TV apps.

Here’s the skinny:

Deadline: 10 May 2011, noon Pacific Daylight Time.

Prize: A brand spanking new iPad 2, ready for our upcoming Boxee iOS app.

Rules: Must leverage the Miso API to do something awesome.

What kind of awesome can be built with Miso and Boxee? Oh how about some of these tasty treats:

  • Auto check-ins on Miso when you watch shows on Boxee
  • Change show on Boxee based upon what your friends watch in Miso
  • Notification when a new episode of a show you follow on Miso is available on Boxee
  • Check out your friends’ favorite shows
  • Leave notes on shows for your friends to see
  • A Boxee app hinting on how what would be best to watch to earn Miso badges
  • Create an auto-running playlist Boxee app based on Miso trends

The ideas just fly off the fingers. More details are available at the Miso blog including their sign-up form.

As usual, I’m here to make sure you win. Hit me up on IRC at FreeNode at #boxee, on Twitter at @boxee_api and via email at rob [at] boxee [dot] tv if you run into any snags.

Go get ‘em!

April 13, 2011 at 5:54 pm

Congrats to hackNY Winners Adit Shukla, Doug Fulop and Eric Seidel

This past weekend NYU’s Mathematical Sciences Building played host to the third hackNY Student Hackathon, drawing over 150 students from 50 different schools up and down the Eastern Seaboard. Giving up a sunny Saturday in New York, college hackers drove through the night to produce 24 different hacks to present to luminaries of the NYC tech community.

Etsy Shopping Network AppPulling down the top overall prize was a Boxee based hack called “Etsy Shopping Network.” This HTML5 app is an elegant window-shopping-in-Williamsburg take on the TV shopping experience developed by the prodigious team of Adit Shukla (@aditshukla), Doug Fulop (@dougfulop) and Eric Siedel (@gridaphobe).

Designed by Adit, the simple interface let’s users peruse their favorite Etsy items and puts the gorgeous product photography front and center in a 10-foot interface. Eric wrote the backend in Ruby, leveraging the Sinatra framework and the Etsy API. Finally, Doug made the interface go, picking up some strong jQuery-fu in the process.

The app is available for Boxee Box users by adding this repository to your install:

http://tapp.boxee.tv/partners/etsyshoppingnetwork

Don’t have the Boxee Box? Scope it out in your browser at:

http://etsy-tv.heroku.com

Congrats Adit, Doug and Eric - can’t wait to see what you come up with next!

April 11, 2011 at 5:51 pm

Helpful Debug Grid from Bartsidee

Late last year Dutch developer Bartsidee exploded onto the Boxee scene with a popular custom repo delivering some widely used applications. Bart has also been huge on the Boxee Forums helping developers get started on Boxee and providing a lot of tips and tricks. His repository is one of my favorite to watch on GitHub and he just released a simple but helpful grid graphic to help debug your UI layouts in Boxee.

Check it out:

Bart has laid out markers in pixels to help you place your controls on the grid. Super useful to put as a background on your application while you are doing your UI design. Simply drop thing PNG inside your media folder and put it in the background by making it the bottom image control on your UI stack. You can do so with just a few lines of XML:

<control type="image">
   <width>1280</width>
   <height>720</height>
   <texture>debuggrid.png</texture>

Thanks Bart - enjoy!

March 2, 2011 at 11:55 am

What Oscars? Hear Rob Talk at SCALE9x!

Is there something else going on in Los Angeles this weekend? SCALE9x crashes the Airport Hilton in sunny Los Angeles this weekend and open source enthusiasts from around the globe are descending en force. Swapping red carpets for red fedoras and VIP passes for IPv6 classes, the international FOSS community is gathering for one of the biggest open source conferences geared toward the discriminating hardcore geek.

Boxee will be there representing in full effect with your friendly neighborhood community evangelist Rob sporting the punch-drunk frog loud and proud all weekend long. Check out these tasty Boxee appearances on Saturday:

  • Open Source Television - 3pm Saturday, Century AB: Rob gives a talk on what Boxee gives and gets from the open source community.
  • FLOSS Media Center Panel - 1:30pm Saturday, La Jolla: Rob joins XBMC’s Cory Fields and LinHES’s Cecil Watson and Michael Hanson to talk about the future of open source in the living room.
  • The Weakest Geek - 7:30pm Saturday, La Jolla: Street cred is the most valuable currency in SCALE9x’s annual geek trivia contest - will Rob have what it takes to be the weakest of all?

Full schedule of festivities is here. Rob will be in attendance all weekend, so keep an eye out for a Boxee t-shirt, a punk rock Thinkpad and a hearty laugh and say hello!

Tags: ,
February 24, 2011 at 1:26 pm

Developing HTML5 on Boxee

It’s Valentine’s Day at Boxee and users are already feeling the love. Of course, we never want to leave out our developers from our affection, so I thought I’d rap a bit about our support for HTML5.

We feel strongly that the future of TV apps is a cross-platform one, where developers write code once and users enjoy the experiences across multiple devices and screens. HTML5 can create rich experiences across many platforms on the desktop, on mobile devices and - of course - in the living room. We’re on board with this new standard and would like to invite you to try your hand on building an HTML5 app on the Boxee Box.

Setting up an HTML5 app is super easy - just three steps!

1) Creating the descriptor.xml

Like RSS and skin Boxee apps, HTML5 apps start with a descriptor.xml. Let us first consider this example.

<app>
  <id>example</id>
  <name>Example HTML5 App</name>
  <version>1.0</version>
  <description>An example HTML5 app using the new Boxee browser.</description>
  <thumb>http://example.com/thumbnail.png</thumb>
  <repository>http://dir.boxee.tv/apps</repository>
  <media>video</media>
  <copyright>Example, inc</copyright>
  <type>html</type>
  <url>http://www.example.com/html5app</url>
  <controller>http://example.com/boxee.js</controller>
  <platform>all</platform>
  <minversion>1.0</minversion>
  <test-app>true</test-app>
</app>

There are three new important values and one new element we introduced just for HTML5 apps.

  • <type>html</type> - This element defines the Boxee app as an HTML5 app.
  • <url>http://www.example.com/html5app</url> - Like in RSS apps, we use the url element as the link to our HTML5 application.
  • <controller>http://example.com/boxee.js</controller> - A new element in the descriptor.xml, the value for controller should be the link to your Javascript control file.
  • <minversion>1.0</minversion> - HTML5 support is a feature only available in Boxee 1.0; setting this value ensures that the app will be visible only for Boxee 1.0 clients (e.g. the Boxee Box).

2) Creating the Javascript controller

Along with HTML5 support, we’ve introduced a new browser mode to our Javascript API making it super simple to use the Boxee Box remote with your HTML5 app. Called keyboard mode, setting this in your Javascript controller file now allows you to produce simple up/down/left/right navigation in your app with only three lines of Javascript code:

boxee.apiMinVersion=7.0;
boxee.reloadOnPageChange = true;
boxee.setMode(boxee.KEYBOARD_MODE);

3) Installing your app on your Boxee Box

Follow the handy and dandy new testing instruction we have available on the Developer wiki.

Enjoy this new feature of the Boxee platform and comment with your experience.

February 14, 2011 at 3:11 pm

Boxee API Keys Are Here!

As you may have heard via email and on the forums, the upcoming SP4 release for the Boxee Box will include the introduction of API keys for Boxee developers. Only barely eclipsed by the news that the White Stripes are breaking up, the announcement of this new process has generated a lot of questions and we’re happy to report that the interface to get your API key is now live here.

In the next release of Boxee, all apps running on the Boxee Box will need to be signed by an API key. What does this mean for you and your application?

Here are some quick answers to the most common questions:

1) Why are you doing this?

This rollout is in reaction to an increasingly common security requirement among premium content providers. Distributing API keys to create signatures for applications is a frequent feature of the Smart TV space and we’re following suit.

2) What do I need to do?

If your app is in the Boxee App Library, you don’t need to do anything. Your app is already signed for you and will not be affected by the next release. If you are distributing your app through your own repository, we recommend you get an API key and get your application signed.

3) How do I sign up for an API key?

You can sign up for a developer account and get issued an API key by going here and signing up for a developer account. Developer accounts on Boxee are of course free and keys are generated automatically.

4) How do I sign my app?

Once you have signed up for a profile, you can get your app signed here.

1. Login to boxee.tv
2. Navigate to http://boxee.tv/developer
3. If you haven’t already, register as a developer by filling out the profile form
4. Click on the Apps tab
5. Upload the zip of your application that you will distribute in your repository
6. Click “All Versions and Signatures”
7. Click “Download Signature”
8. Place the downloaded xml file in your repository’s download directory

    5) Should I sign up even if I don’t maintain my own repository?

    Yes! We’ll be using Boxee API keys in the future for making available new services and features for developers. Sign up now and register your apps.

    We are encouraging all developers maintaining their own repositories sign their apps as soon as possible. If you have any problems or questions, I’m here - you can get ahold of me through the following media:

    Updated: 6) Are there any changes to the API?

    Be sure your descriptor.xml has a <repository> element - it is now a required. For apps submitted to the App Library this value should be “http://dir.boxee.tv/apps/”.

    • Email: developer [at] boxee [dot] tv
    • Twitter: @boxee_api
    • IRC: #boxee on FreeNode
    February 3, 2011 at 11:18 pm

    Come See Rob Talk Tomorrow in NYC / Come Party with the Boxee Crew 10 Nov.

    We’re 15 days away from the launch of the Boxee Box from D-Link, our first dedicated hardware device to hit the market! Boxee HQ is buzzing with anticipation of the release and I know you in our developer community are as well. It’s a special time for this community that we’ve built together and a whole lot of engineering blood and sweat will be on display in a couple short weeks.

    In anticipation of the release, I’ll be giving a talk to the New York Personal Computer User Group about how we use open source at Boxee, give a brief overview of the development platform, show off the new Boxee Box and of course answer a bunch of your questions. Here are the details on this month’s meeting of NYPC:

    At Ripley-Grier, 520 8th Ave, between 36th & 37th Street
    10th floor, Room 10D
    Doors Open 6pm, Presentation 6:45 - 8:45

    And on launch day 10 November Boxee and D-Link will be throwing a Boxee Box launch in Manhattan. We’ll be debuting the Boxee Box live, showing off some new surprises and pushing our baby out into the market in style. Already 1,000 people have RSVPed - be sure to sign up now before the event sells out!

    October 26, 2010 at 5:04 pm

    How to Use Dialogs in Your Boxee App

    A great new feature in our last client release that devs have been asking about is the introduction of the “dialog” window type to our platform UI. Dialogs allow you to define frequently used combinations of UI elements in a separate XML file and activate them from any window. This allows you to reduce the amount of duplicate markup in your app and make future maintenance far simple than duplicating similar controls in each window. In this post we’ll look at a simple example demonstrating how to use this feature.

    First, we create a simple skin with two controls: a background image and a button control in a file called main.xml and assign it Window ID 14000.

    <?xml version="1.0"?>
    <window type="window" id="14000">
    	<defaultcontrol always="true">100</defaultcontrol>
    	<allowoverlay>no</allowoverlay>
    	<controls>
    		<control type="image" id="101">
    			<posx>0</posx>
    			<posy>0</posy>
    			<width>1280</width>
    			<height>720</height>
    			<texture>background-main.png</texture>
    		</control>
    		<control type="button" id="100">
    			<posx>200</posx>
    			<posy>200</posy>
    			<width>145</width>
    			<height>145</height>
    			<label>Click Me!</label>
    			<font>font36b</font>
    			<textcolor>white</textcolor>
    			<focusedcolor>gray</focusedcolor>
    			<texturefocus>-</texturefocus>
    			<texturenofocus>-</texturenofocus>
    		</control>
    	</controls>
    </window>

    The result looks a little like this:

    Next, we create our dialog window with three controls in a file named dialog.xml and assign it Window ID 14001.

    1. A diffused background image to darken the window we just created behind our new dialog.
    2. A button control to close our dialog window.
    3. A Boxee logo (who doesn’t need to see more of them?)
    <?xml version="1.0"?>
    <window type="dialog" id="14001">
     <defaultcontrol always="true">300</defaultcontrol>
     <allowoverlay>no</allowoverlay>
    	 <controls>
    	 	<control type="group" id="7001">
    			<control type="image">
    				<width>1280</width>
    				<height>720</height>
    				<texture>white.png</texture>
    				<colordiffuse>DD202020</colordiffuse>
    			</control>
    			<control type="button" id="300">
    				<posx>565</posx>
    				<posy>75</posy>
    				<width>145</width>
    				<height>145</height>
    				<label>Close Me!</label>
    				<font>font36b</font>
    				<textcolor>green</textcolor>
    				<focusedcolor>green</focusedcolor>
    				<texturefocus>-</texturefocus>
    				<texturenofocus>-</texturenofocus>
    			</control>
    			<control type="image">
    				<posx>244</posx>
    				<posy>100</posy>
    				<width>792</width>
    				<height>612</height>
    				<texture>logo.png</texture>
    			</control>
    		</control>
    	 </controls>
    </window>

    Now we need to activate our dialog from our main window. To do this, we add an onclick event to the button control in main.xml and introduce an easy ActivateWindow() method using the ID of our dialog (14001) as the argument.

    		<control type="button" id="100">
    			<posx>200</posx>
    			<posy>200</posy>
    			<width>145</width>
    			<height>145</height>
    			<label>Click Me!</label>
    			<font>font36b</font>
    			<textcolor>white</textcolor>
    			<focusedcolor>gray</focusedcolor>
    			<texturefocus>-</texturefocus>
    			<texturenofocus>-</texturenofocus>
    			<onclick lang="python"><![CDATA[
    mc.ActivateWindow(14001)
    ]]></onclick>
    		</control>

    Once we restart the app, we can now see the three controls we created in our dialog appear over our window. Bamf!

    But, it is not merely enough to display a dialog window - we need the user to be able to close it as well. So we use the xbmc module to execute a method called “Dialog.Close()”. We do this by first importing the xbmc module in an onload event for the dialog.

    <?xml version="1.0"?>
    <window type="dialog" id="14001">
     <defaultcontrol always="true">300</defaultcontrol>
     <allowoverlay>no</allowoverlay>
     <onload lang="python"><![CDATA[
    import xbmc
    mc.LogDebug(message)
    ]]>
    </onload>

    We then can execute it by adding the following onclick event to our dialog’s button control.

    			<control type="button" id="300">
    				<posx>565</posx>
    				<posy>75</posy>
    				<width>145</width>
    				<height>145</height>
    				<label>Close Me!</label>
    				<font>font36b</font>
    				<textcolor>green</textcolor>
    				<focusedcolor>green</focusedcolor>
    				<texturefocus>-</texturefocus>
    				<texturenofocus>-</texturenofocus>
    				<onclick lang="python"><![CDATA[
    xbmc.executebuiltin("Dialog.Close(14001)")
    ]]></onclick>
    			</control>

    Once we restart the app, we can now toggle between our dialog window and our main window!

    The uses for dialogs in Boxee apps are limited only by your own creativity and can help keep your app’s XML tight and maintainable. Enjoy!

    Complete examples:

    main.xml

    <?xml version="1.0"?>
    <window type="window" id="14000">
    	<defaultcontrol always="true">100</defaultcontrol>
    	<allowoverlay>no</allowoverlay>
    	<controls>
    		<control type="image" id="101">
    			<posx>0</posx>
    			<posy>0</posy>
    			<width>1280</width>
    			<height>720</height>
    			<texture>background-main.png</texture>
    		</control>
    		<control type="button" id="100">
    			<posx>200</posx>
    			<posy>200</posy>
    			<width>145</width>
    			<height>145</height>
    			<label>Click Me!</label>
    			<font>font36b</font>
    			<textcolor>white</textcolor>
    			<focusedcolor>gray</focusedcolor>
    			<texturefocus>-</texturefocus>
    			<texturenofocus>-</texturenofocus>
    			<onclick lang="python"><![CDATA[
    mc.ActivateWindow(14001)
    ]]></onclick>
    		</control>
    	</controls>
    </window>

    dialog.xml

    <?xml version="1.0"?>
    <window type="dialog" id="14001">
     <defaultcontrol always="true">300</defaultcontrol>
     <allowoverlay>no</allowoverlay>
     <onload lang="python"><![CDATA[
    import xbmc
    mc.LogDebug(message)
    ]]>
    </onload>
    	 <controls>
    	 	<control type="group" id="7001">
    			<control type="image">
    				<width>1280</width>
    				<height>720</height>
    				<texture>white.png</texture>
    				<colordiffuse>DD202020</colordiffuse>
    			</control>
    			<control type="button" id="300">
    				<posx>565</posx>
    				<posy>75</posy>
    				<width>145</width>
    				<height>145</height>
    				<label>Close Me!</label>
    				<font>font36b</font>
    				<textcolor>green</textcolor>
    				<focusedcolor>green</focusedcolor>
    				<texturefocus>-</texturefocus>
    				<texturenofocus>-</texturenofocus>
    				<onclick lang="python"><![CDATA[
    xbmc.executebuiltin("Dialog.Close(14001)")
    ]]></onclick>
    			</control>
    			<control type="image">
    				<posx>244</posx>
    				<posy>100</posy>
    				<width>792</width>
    				<height>612</height>
    				<texture>logo.png</texture>
    			</control>
    		</control>
    	 </controls>
    </window>
    October 1, 2010 at 4:10 pm

    The 10 Essentials of Making a Great Boxee App

    Jeremy Toeman over at Stage Two just posted a great piece on the 10 essentials of making a great Boxee app. He opens up the list with a personal fave bit of advice for first time Boxee devs:

    10 – Avoid Input Fields At All Costs

    The Boxee Box comes with a clever remote that includes a full QWERTY keyboard on its reverse. That is awesome. Scratch that, it’s super-awesome. Hopefully you only use it when you should – specifically when you are searching for something, logging into something, or some other highly meaningful purpose. Content for the interactive television is not the same as content for a computer or mobile device. Smart couch surfing should feel like analogue couch surfing- not in the content delivered, but in the manner in which it is accessed. If your App asks the user to “type” every 2 minutes, you might as well be thinking of a computer experience, not a TV one.

    Check out the full post over at Stage Two.

    September 17, 2010 at 4:55 pm