Opera Developer News

This morning, we've released Opera 12 beta and as always, a new release comes with improved standards support and other developer features — a quick overview of the shiny:

Hardware acceleration and WebGL support

As announced last week, we're aiming to make Opera entirely hardware accelerated, from the UI to all page rendering and painting (with support for OpenGL as well as DirectX backends), but for now, both HWA and WebGL are turned off by default. You can enable them by setting opera:config#UserPrefs|EnableWebGL and opera:config#UserPrefs|EnableHardwareAcceleration to 1, saving and restarting the browser.

If you're interested in trying out a WebGL demo, check out Emberwind; if you want to start coding WebGL, have a look at our WebGL articles.

CSS3 Animations and more animatable properties

Opera 12 beta supports CSS3 animations, and we have prepared a fitting Dev.Opera article to celebrate that.

We've also expanded our support for animatable properties (so you can animate them using CSS3 transitions as well as CSS3 animations) to include background-position, border-bottom-color, border-color, border-left-color, border-right-color, border-top-color, and text-shadow. Furthermore, step-start, step-end and steps timing functions for transition-timing-function are supported as well.

Generated Content for Paged Media

The CSS Generated Content for Paged Media Module is a spec spearheaded by our CTO Håkon Wium Lie, and it allows you to create a page-like browsing experience on web pages by adding a few lines of CSS to your content. Opera 12 beta includes a partial implementation of the spec, which you can try out using Håkon's examples. Tip: use your mouse's horizontal scrolling mechanism to move to the next page, or try PageUp/Down.

Camera support with getUserMedia

A lot has happened since we announced our first build with camera support in March 2011, and last week getUserMedia has finally landed in our Next channel (and in this beta of course), with a fresh privacy UI to boot. If you want to get started building stuff, check out our getUserMedia article. For demo fun, there are our Photo Booth, Polaroid, Color Picker and Explode examples.

CORS

Opera 12 beta comes with support for cross-origin resource sharing, also known as CORS. If you want to learn how to use this in your site, check out our Dev.Opera article about it: DOM access control using cross-origin resource sharing.

Drag and Drop

HTML5 includes the Drag and Drop API, which gives us the ability to natively drag, drop, and transfer data to HTML elements, and now this is supported in Opera 12 beta as well. We have published a fresh article detailing how to use Drag and Drop earlier today, so be sure to have a look.

Updated Windows & Tabs extension API

Opera 12 beta comes with an update to the Windows & Tabs API, for which we have published updated documentation. Be sure to read through it if your existing Opera extension relies on it, and feel free to ask questions in the comment section on the API pages.

Discontinuation of Unite and Widgets

Earlier this week, we announced that we're discontinuing Unite and Widgets in Opera 12, but at the same time are going full steam ahead with our extensions platform. For those who want to convert their existing widgets to extensions, we've produced an article to help you with the conversion process.

Themes

If you want to spice up your browsing experience, with, let's say, a cookie monster-themed browser UI, be sure to check out our new themes catalog. Making themes is super easy, and the nitty-gritty details of Opera 12's new theming infrastructure are explained in our Opera's lightweight themes article.

And last but not least, our product specs overview page has been updated as well, giving you an overview of what is supported where in all recent Opera products.

In 1969, we were told that someday, you'll be a star, and after great efforts from the open web community, that time has come! Access to the camera from a web page through JavaScript (getUserMedia) is possible. Grab the latest Opera Next version from the desktop team blog!

Let's rewind a bit. On October 2011 and January 2012, we released desktop Labs builds for testing getUserMedia. Your feedback has been valuable and helped fixed issues.

The first time you access a web page that requests access to the camera, you will get a notification requesting you to authorize it. It's time to rush to the bathroom, fix your hair, make up, change your shirt and smile. If you are not satisfied, you can deny right away.

Then you might want to change these settings later on - perhaps your image on the camera was not what you were expecting. Just click on the icon on the address bar and a menu pops up.

Good! Now you have the choice in between a few options: Always, Allow once or Deny.

There will always be an icon in the toolbar or the tab to tell you that the camera access is ongoing in case you had forgotten. It's worth noting that we do something similar for sites that request access to your geolocation.

The API for accessing the camera is fairly simple.

navigator.getUserMedia({audio: true, video: true}, success, error);

 function success(stream) {
  // ... use 'stream' ...
  }
 
  function error(){
  //display fallback content
  }

You can find more code samples and advanced examples in Daniel Davis' Dev.Opera article about getUserMedia.

And because we all need a moustache to be a star:

Time for you to code your project and share with us.