Open Source Media Framework (OSMF) is an open software framework for building robust, feature-rich video players and applications based on the Adobe® Flash® Platform.

Anyone have any experience working with it?

Designing with Progressive Enhancement

Designing with Progressive Enhancement is a practical guide that both explains the principles and benefits of progressive enhancement, and explores detailed examples to teach you how, where, and when to implement specific coding and scripting approaches that embody broadly accessible development practices.

I just pre-ordered the book. You should too if you do anything in design or user experience.

“The quiz mainly focuses on knowledge of scoping, function expressions (and how they differ from function declarations), references, process of variable and function declaration, order of evaluation, and a couple more things like delete operator and object instantiation.”

I missed 3. How about you?

Uniform

“Uniform masks your standard form controls with custom themed controls. It works in sync with your real form elements to ensure accessibility and compatibility.”

An excellent jQuery plugin for styling forms. It even supports theming, though not through the ThemeRoller.

“Bcrypt is a cross platform file encryption utility. Encrypted files are portable across all supported operating systems and processors. Passphrases must be between 8 and 56 characters and are hashed internally to a 448 bit key. However, all characters supplied are significant. The stronger your passphrase, the more secure your data.”

For us Java developers, there’s jBCrypt. It is an “implementation of OpenBSD’s Blowfish password hashing code” and offers a rather simple API. A quick web search yields a bit of information on using jBCrypt itself, but nothing on integrating it with the Spring Framework. Given that this is a topic of interest to me, I’ve put together a simple, yet comprehensive example web application to demonstrate an integration of jBCrypt, Spring MVC, Spring Security and Hibernate for hashing user passwords. There are three areas I’ve focused on in this example, user creation, user authentication and changing the user’s password.

Unlike other solutions, jBCrypt is surprisingly easy to use. When a new user registers for our simple application, the password is hashed using BCrypt.hashpw(rawPass, salt). You, the developer, are given a choice of providing a salt or generating a random salt with BCrypt.gensalt(). I’ve chosen to use a random salt for each hash, increasing the strength of the solution. Here’s a look at the code responsible for creating the new User object.

JoinController.java

@Controller
public class JoinController {
    ...
    @RequestMapping(value = "/join.do", method = RequestMethod.POST)
    public String processSubmit(@ModelAttribute("form") JoinForm form, BindingResult result) {
        logger.debug("Processing join form.");
        new JoinFormValidator().validate(form, result);
        if (!result.hasErrors()) {
            User user = new User(
                    form.getUsername(),
                    BCrypt.hashpw(form.getPassword(), BCrypt.gensalt()),
                    form.getEmail());
            service.create(user);
            return "join-success";
        }
        return "join";
    }
    ...
}

The astute observer might note that I could have used a Hibernate Interceptor to hash the password when the User is inserted into the database. And while that is a valid solution, I prefer to get rid of the original password sooner and keep the hashing routine along side the User creation code.

User authentication with Spring Security needs to use a PasswordEncoder implementation to hash and validate the supplied password. This is straight forward to do as is demonstrated in the example application.

BCryptPasswordEncoder.java

public class BCryptPasswordEncoder implements PasswordEncoder {

    public String encodePassword(String rawPass, Object salt) throws DataAccessException {
        logger.debug("Encoding password.");
        return BCrypt.hashpw(rawPass, BCrypt.gensalt());
    }

    public boolean isPasswordValid(String encPass, String rawPass, Object salt) throws DataAccessException {
        logger.debug("Validating password.");
        return BCrypt.checkpw(rawPass, encPass);
    }
}

As you can see, there really isn’t much to this. You’ll need to instruct Spring Security to use your PasswordEncoder by adding a bean definition and dependency to your context configuration file.

spring-security.xml

    <authentication-provider user-service-ref="userService">
        <password-encoder ref="passwordEncoder"/>
    </authentication-provider>

    <beans:bean id="passwordEncoder" class="net.sziebert.tutorials.security.BCryptPasswordEncoder"/>

Changing the user’s password is no different, though it does have two parts to get it right. Because we require the user to supply their original password before updating it, we need to insure the input is correct.

ChangePasswordFormValidator.java

public class ChangePasswordFormValidator implements Validator {
    ...
    public void validate(Object obj, Errors errors) {
        logger.debug("Validating change password form.");
        ChangePasswordForm form = (ChangePasswordForm) obj;
        ...
        // Insure the specified original password actually matches the performer's current password.
        if (isNotBlank(form.getPassword())) {
            if (!BCrypt.checkpw(form.getOriginal(), user.getPassword())) {
                errors.rejectValue("original", "error.original.password.mismatch");
            }
        }
    }
}

Once the original validates correctly, we can then update the database with the a new hash. Like the previous examples, this is trivial to accomplish.

ChangePasswordController.java

@Controller
public class ChangePasswordController {
    ...
    @RequestMapping(value = "/password.do", method = POST)
    public String processSubmit(HttpServletRequest request,
                                @ModelAttribute("form") ChangePasswordForm form,
                                BindingResult result) {
        logger.debug("Processing change password form.");
        User user = service.findByUsername(getCurrentUsername());
        new ChangePasswordFormValidator(user).validate(form, result);
        if (!result.hasErrors()) {
            user.setPassword(BCrypt.hashpw(form.getPassword(), BCrypt.gensalt()));
            service.update(user);
            request.getSession().setAttribute("message", "You have successfully changed your password.");
            return "redirect:/home.do";
        }
        return "change-password";
    }
    ...
}

As with all of my posts, I invite you to download the example application and give it a try. Make sure that you’ve got all of the dependencies and have compiled the source by running ant compile. Let me know if you’ve got questions or feedback.

The example source code for this post can be downloaded here.

Recording the stream on the server takes one simple line as displayed here:

StreamManager.java

ClientBroadcastStream stream = (ClientBroadcastStream) app.getBroadcastStream(conn.getScope(), "hostStream");
try {
	// Save the stream to disk.
	stream.saveAs(streamName, false);
} catch (Exception e) {
	logger.error("Error while saving stream: {}", streamName);
}

The only button in the broadcast application starts and stops the recording session. The click handler does all the work:

Broadcast.as

private function onClick(event:MouseEvent):void {
	var button:Button = event.target as Button;
	// Record the stream by triggering a server event.
	if (button.label == "Record") {
		// Tell the remote server to start recording.
		runtime.conn.call("streamManager.recordShow", null);
		// Re-label the button.
		button.label = "Stop";
	// Stop recording the stream.
	} else if (button.label == "Stop") {
		// Tell the remote server to stop recording.
		runtime.conn.call("streamManager.stopRecordingShow", null);
		// Re-label the button.
		button.label = "Record";
	}
}

Like I said, not much to it. But there’s a lot of power wrapped up in this little piece of functionality.

Grab the source code for this tutorial here. The example code was updated to be compatible with Red5 0.9.1 on July 29, 2010.

“The Xuggler is a free and open-source library for Java or C++ developers that allows you to decode, manipulate, and encode (almost) any type of video file in near real time. It is for programmers who want to add video processing support to their products.”

What does this mean for me, you ask? Let me provide some history for you on my own experiences. When I started out with streaming media back in 2004, there was only one decent way to build applications. That was using SSAS on Flash Communications Server 1.5. (For those of you into fact checking, Red5 was around back then, but was still very much in it’s infancy.) To accomplish something like the functionality available in Xuggler was next to impossible. Transforming a stream wasn’t exact an “on-the-fly” activity. It meant installing FFmpeg, writing some sort of wrapper around it and then invoking it as a post-process after the stream had finished recording to disk. Even a relatively trivial task like pulling screenshots out of a live stream required a huge amount of overhead and in-depth knowledge of the FFmpeg internals. Xuggler is aimed squarely at making this sort of thing much simpler. Don’t believe me? Give their demo a look:

In addition to open-sourcing the project, Xuggle also provides an added benefit to Red5 developers in the form of a native adapter to create stream mash-ups in near real time. If that isn’t enough to convince you to check out Xuggler, then I’m not sure what is. Details on the project can be found here. The source code can be checked out from Subversion here.

*Note: If you are not familiar with my first post on this topic, please give it a read before continuing here.

Getting started, the only item left untouched by the refactoring is the User object. Given that I originally defined the class using the Hibernate annotations there is nothing to change other than to use the annotation based SessionFactory by default. I should note that the Hibernate mapping (HBM) file for the User object no longer exists in the source tree.

User.java

@Entity
@Table(name = "users")
public class User {

    @Id
    @GeneratedValue
    @Column(name = "id", nullable = false)
    private Long id;

    @Column(name = "user_name", nullable = false, length = 32, unique = true)
    private String userName;

    @Column(name = "password", nullable = false)
    private String password;

    @Column(name = "first_name", length = 64)
    private String firstName;

    @Column(name = "last_name", length = 64)
    private String lastName;

    @Column(name = "email", nullable = false)
    private String email;

    ...
}

HibernateApplicationDAO has been given a new name and is now HibernateApplicationRepository. This is one of the biggest changes here and removes the dependency on Spring’s HibernateTemplate. HibernateTemplate was originally created to work around the limitations of Hibernate 2′s usage of checked exceptions. Because Hibernate now uses unchecked runtime exceptions, it is no longer necessary. Injection of the SessionFactory into the repository object gives us direct access to the current HibernateSession. The @Repository annotation has been added to support transactions and persistence exception translation.

HibernateApplicationRepository.java

@Repository
public class HibernateApplicationRepository implements ApplicationRepository {

    private static final Logger logger = Red5LoggerFactory.getLogger(HibernateApplicationRepository.class, "hibernate");

    private SessionFactory sessionFactory;

    public User getUser(String user, String pass) {
        logger.debug("Retrieving user from the database.");
        // Ask Hibernate to query for the user based upon the specified user/pass.
        Criteria crit = sessionFactory.getCurrentSession().createCriteria(User.class);
        crit.add(Restrictions.eq("userName", user));
        crit.add(Restrictions.eq("password", pass));
        User u = (User) crit.uniqueResult();
        // Insure that we got something back from Hibernate.
        if (null == u) {
            logger.warn("User does not exist for credentials: {}/{}", user, pass);
            throw new ObjectRetrievalFailureException(User.class, user);
        }
        // Return the results.
        return u;
    }

    @Required
    public void setSessionFactory(SessionFactory sessionFactory) {
        this.sessionFactory = sessionFactory;
    }
}

ApplicationServiceImpl is now annotated with the @Service and @Transactional annotations. With these annotations, we no longer need to proxy ApplicationServiceImpl and can eliminate several lines of XML in the configuration file while maintaining full transaction support.

ApplicationServiceImpl.java

@Service
@Transactional
public class ApplicationServiceImpl implements ApplicationService {

    private static final Logger logger = Red5LoggerFactory.getLogger(ApplicationServiceImpl.class, "hibernate");

    private ApplicationRepository repository;

    @Transactional(readOnly = true)
    public User getUser(String user, String pass) throws ServiceException {
        logger.debug("Looking up user for user/pass of: {}/{}", user, pass);
        try {
            // Return the result of the data access call.
            return repository.getUser(user, pass);
        }
        catch (Exception e) {
            logger.error("Could not load user with credentials: {}/{}", user, pass);
            throw new ServiceException("Could not load user!", e);
		}
	}

    @Required
    public void setApplicationRepository(ApplicationRepository repository) {
        this.repository = repository;
    }
}

As you can see from the following bean declaration, we’ve cut down on the XML configuration significantly by taking advantage of these annotations.

red5-web.xml

    <tx:annotation-driven/>

    <bean id="transactionManager" class="org.springframework.orm.hibernate3.HibernateTransactionManager">
        <property name="sessionFactory" ref="sessionFactory"/>
    </bean>

    <bean id="applicationRepository" class="net.sziebert.tutorials.dao.hibernate.HibernateApplicationRepository">
        <property name="sessionFactory" ref="sessionFactory"/>
    </bean>

    <bean id="applicationService" class="net.sziebert.tutorials.service.impl.ApplicationServiceImpl">
        <property name="applicationRepository" ref="applicationRepository"/>
    </bean>

For the sake of direct comparison, here is the original bean declaration:

red5-web.xml

    <bean id="transactionManager" class="org.springframework.orm.hibernate3.HibernateTransactionManager">
        <property name="sessionFactory" ref="sessionFactory" />
    </bean>

    <bean id="txProxyTemplate" abstract="true" class="org.springframework.transaction.interceptor.TransactionProxyFactoryBean">
        <property name="transactionManager">
            <ref local="transactionManager" />
        </property>
        <property name="transactionAttributes">
            <props>
                <prop key="get*">PROPAGATION_REQUIRED,readOnly</prop>
                <prop key="save*">PROPAGATION_REQUIRED</prop>
                <prop key="update*">PROPAGATION_REQUIRED</prop>
                <prop key="delete*">PROPAGATION_REQUIRED</prop>
            </props>
        </property>
    </bean>

    <bean id="applicationDAO" class="net.sziebert.red5.adapter.dao.hibernate.HibernateApplicationDAO">
        <property name="hibernateTemplate" ref="hibernateTemplate" />
    </bean>

    <bean id="applicationService" parent="txProxyTemplate">
        <property name="target">
            <bean class="net.sziebert.red5.adapter.service.impl.ApplicationServiceImpl">
                <property name="applicationDAO" ref="applicationDAO" />
            </bean>
        </property>
    </bean>

All classes now use the improved Red5 logging support which is backed by SLF4J and Logback by default. Here is an example from the ApplicationAdapter subclass:

Application.java

public class Application extends ApplicationAdapter {

    private static final Logger logger = Red5LoggerFactory.getLogger(Application.class, "hibernate");

    private ApplicationService service;

    /* ----- ApplicationAdapter delegate methods ----- */

    @Override
    public boolean roomConnect(IConnection conn, Object[] params) {
        logger.debug("New connection attempt from {}...", conn.getRemoteAddress());
        // Parse the user/pass out of the connection parameters
        String userName = (String) params[0];
        String password = (String) params[1];
        // Get the User object for this connection
        User user = null;
        // Insure that we have received the proper set of parameters.
        if (isNotBlank(userName) &&
                isNotBlank(password)) {
            user = authenticate(userName, password);
        }
        // If we got a valid user object, then allow the connection. Otherwise,
        // the user could not be found or something bad happened. In either
        // case, we do not want to allow the connection.
        return user != null && super.roomConnect(conn, params);
    }

    ...
}

The flash client code has been rewritten entirely in ActionScript 3 and was reduced down to a single class for the entire application. For those of you following along with the source, you’ll note that there are actually 2 classes. The second one is a simple dynamic class used to store runtime related resources and could be easily removed from the implementation. It was a design decision on my part to keep it. ActionScript 3 is much more object-oriented than it’s predecessor and leverages the new keyword for constructing components.

Hibernate.as

package net.sziebert.tutorials {

	import com.adobe.crypto.MD5;

	import fl.controls.Button;
	import fl.controls.Label;
	import fl.controls.TextArea;
	import fl.controls.TextInput;
	import fl.managers.StyleManager;
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.events.NetStatusEvent;
	import flash.events.SecurityErrorEvent;
	import flash.net.NetConnection;
	import flash.net.ObjectEncoding;
	import flash.net.registerClassAlias;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFormat;

	import net.sziebert.tutorials.Runtime;

	public class Hibernate extends Sprite {

		private var connect:Button;
		private var pass:TextInput;
		private var passLbl:Label;
		private var runtime:Runtime;
		private var textArea:TextArea;
		private var user:TextInput;
		private var userLbl:Label;

		public function Hibernate():void {
			trace("Starting Hibernate application...");
			runtime = Runtime.getInstance();
			stage.align = StageAlign.TOP_LEFT;
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.addEventListener(Event.RESIZE, onResize);
			createChildren();
		}

		/* ----- Utility functions ----- */

		private function createChildren():void {
			// Create the username label.
			userLbl = new Label();
			userLbl.text = "Username:";
			userLbl.autoSize = TextFieldAutoSize.LEFT;
			addChild(userLbl);
			// Create the username input field.
			user = new TextInput();
			user.maxChars = 255;
			user.restrict = "A-Za-z 0-9:;()|.,?!$&*{}[]+=_-'"";
			addChild(user);
			// Create the password label,
			passLbl = new Label();
			passLbl.text = "Password:";
			passLbl.autoSize = TextFieldAutoSize.LEFT;
			addChild(passLbl);
			// Create the password input field.
			pass = new TextInput();
			pass.maxChars = 255;
			pass.displayAsPassword = true;
			addChild(pass);
			// Create the connect button.
			connect = new Button();
			connect.label = "Connect";
			connect.addEventListener(MouseEvent.CLICK, onClick);
			addChild(connect);
			// Create the text area to display the log information.
			textArea = new TextArea();
			textArea.editable = false;
			textArea.wordWrap = true;
			addChild(textArea);
			// Remove the avatar.
			removeChildAt(0);
			// Size the elements.
			setSize(stage.stageWidth, stage.stageHeight);
		}

		private function setSize(w:Number, h:Number):void {
			// Move and size the username components
			userLbl.move(18, 18);
			//userLabel.setSize(50, 22);
			user.move(96, 18);
			user.setSize((w - 226), 22);
			// Move and size the password components
			passLbl.move(18, 50);
			//passLabel.setSize(50, 22);
			pass.move(96, 50);
			pass.setSize((w - 226), 22);
			// Move and size the connect button
			connect.move(w - 118, 18);
			connect.setSize(100, 54);
			// Move and size the textarea
			textArea.move(18, 82);
			textArea.setSize((w - 36), (h - 100));
		}

		private function initConnection(username:String, password:String):void {
			if (username == "" || password == "") {
				throw new Error("You must enter a valid username and/or password.");
			}
			// Create the new connection object.
			runtime.conn = new NetConnection();
			runtime.conn.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus);
			runtime.conn.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onSecurityError);
			log("Connecting to Red5...");
			runtime.conn.connect("rtmp://localhost/hibernate/test", username, MD5.hash(password));
		}

		private function log(msg:String):void {
			// Update the chat window with the message
			textArea.text += (msg + "n");
			textArea.verticalScrollPosition = textArea.maxVerticalScrollPosition;
		}

		/* ----- Event handlers ----- */

		private function onResize(event:Event):void {
			setSize(stage.stageWidth, stage.stageHeight);
		}

		private function onClick(event:MouseEvent):void {
			var button:Button = event.target as Button;
			// We are currently connected, so disconnect.
			if (runtime.conn && runtime.conn.connected) {
				runtime.conn.close();
				return;
			}
			try {
				// Initialize the connection
				initConnection(user.text, pass.text);
			} catch (err:Error) {
				// Otherwise we need to show an alert indicating the need for proper user input.
				log("Error: You must enter a valid username and/or password.");
			}
		}

		private function onNetStatus(event:NetStatusEvent):void {
			trace("onNetStatus: " + event.info.code);
			switch (event.info.code) {
			        case "NetConnection.Connect.Success":
					log("Connection attempt successful.");
					connect.label = "Disconnect";
                                        break;
				case "NetConnection.Connect.Rejected":
					log("Connection attempt rejected.");
					break;
				case "NetConnection.Connect.Closed":
					log("Connection closed.");
					connect.label = "Connect";
					break;
				case "NetConnection.Connect.Failed":
					log("Connection failure.");
					break;
		        }
		}

		private function onSecurityError(event:SecurityErrorEvent):void {
        		trace("onSecurityError: " + event);
        	}
	}
}

Lastly, the tutorial now relies upon Ant and Ivy to define and retrieve the necessary dependencies. There’s nothing terribly magical about it, the build script should take care of everything for you. Keep in mind that the Red5 JAR dependency is pulled directly from the continuous integration server and should be up to date with the latest found in the Subversion repository at googlecode. If you aren’t running on the latest from trunk, you should strongly consider replacing this JAR with the one found in your Red5 install.

ivy.xml

<ivy-module version="2.0"
            xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
            xsi:noNamespaceSchemaLocation="http://ant.apache.org/ivy/schemas/ivy.xsd">
    <info organisation="garagetech" module="tutorials"/>
    <configurations defaultconfmapping="default->*">
        <conf name="compile"/>
        <conf name="default"/>
        <conf name="test" extends="default" description="Unit testing dependencies."/>
    </configurations>
    <dependencies>
        <dependency name="commons-dbcp" org="commons" rev="1.2.2"/>
        <dependency name="commons-lang" org="commons" rev="2.4" conf="compile->*"/>
        <dependency name="dom4j" rev="1.6.1"/>
        <dependency name="ejb3-persistence" rev="" conf="compile->*"/>
        <dependency name="hibernate-annotations" org="hibernate" rev="3.4.0"/>
        <dependency name="hibernate-commons-annotations" org="hibernate" rev="3.4.0"/>
        <dependency name="hibernate-entitymanager" org="hibernate" rev="3.4.0"/>
        <dependency name="hibernate-validator" org="hibernate" rev="3.1.0"/>
        <dependency name="hibernate" org="hibernate" rev="3.3.1"/>
        <dependency name="javassist" rev="3.4"/>
        <dependency name="mysql-connector-java" rev="5.0.6-bin"/>
        <dependency name="red5" rev="" changing="true" conf="compile->*"/>
        <dependency name="slf4j-api" rev="1.5.6" conf="compile->*"/>
        <dependency name="spring-aop" org="spring" rev="2.5.6" conf="compile->*"/>
        <dependency name="spring-beans" org="spring" rev="2.5.6" conf="compile->*"/>
        <dependency name="spring-context" org="spring" rev="2.5.6" conf="compile->*"/>
        <dependency name="spring-core" org="spring" rev="2.5.6" conf="compile->*"/>
        <dependency name="spring-jdbc" org="spring" rev="2.5.6"/>
        <dependency name="spring-orm" org="spring" rev="2.5.6"/>
        <dependency name="spring-tx" org="spring" rev="2.5.6"/>
    </dependencies>
</ivy-module>

That covers the significant changes to the tutorial code. As with the first version, you’ll need to configure MySQL to allow Red5 to talk to it. (Notes on this can be found in the README file with the examples.) You’ll also need to add your user data to the tables once Hibernate has generated the schema.

The example source code for this post can be downloaded here.

1. http://osflash.org/red5 For those that aren’t up on Red5, it is a robust Flash Media Server alternative written entirely in Java that supports multi-user video chat, video streaming and real-time, multi-player gaming.

2. http://hibernate.org Hibernate lets you develop persistent classes following object-oriented idiom – including association, inheritance, polymorphism, composition, and collections. It allows you to express queries in its own portable SQL extension (HQL), as well as in native SQL.

3. http://springframework.org Spring is a layered Java/JEE application framework founded on the simple concepts that any tool should be a pleasure to use, that your application code should not depend on Spring APIs and that it should not compete with existing solutions, but should foster integration.

4. http://mysql.com The MySQL database has become the world’s most popular open source database because of its consistent fast performance, high reliability and ease of use.