Today, we’re shipping the first preview release of Bespin Embedded: a complete package for using the Bespin text editor component on your own sites and applications. This release is intended to gather feedback about the API for embedders. A link to the release is at the end of the post.
Ever since Bespin’s launch in February, the focus among nearly everyone, it seems, has been on the code-in-the-cloud experience you get at bespin.mozilla.com. A number of people, I’ll call them “The Fearless”, have taken it upon themselves to pull the text editor component out of Bespin so that they could use it in place of plain old textareas in their applications. A couple of examples of The Fearless are Zembly, XWiki and Play! .
I call them The Fearless because they’ve been working without proper documentation, tooling or support. One of The Fearless made it easier to use Bespin with Rails , but keeping that up-to-date as Bespin has evolved has no doubt been a challenge. And the best documentation available to date has been a blog post that Dion wrote back in March.
We don’t want people to have to be Fearless in order to use the Bespin editor on their sites. During the summer, we hatched a plan for a project that we’ve been calling the Bespin Reboot . Part of that plan is to start making the embedded editor available as a simple, downloadable package complete with documentation.
I’m pleased to announce the first preview release of Bespin Embedded. Bespin Embedded 0.5 is the first release to come from the Rebooted codebase. The goal of this release is to give embedders a chance to give the new code a whirl and provide us with feedback on the new API. Speaking of the new API, using Bespin Embedded no longer requires you to add any JavaScript to your page except Bespin itself:
<!DOCTYPE html>
<html><head>
<link href="BespinEmbedded.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="BespinEmbedded.js"></script>
<style>
.bespin { margin: 0; padding: 0; border: 0;
height: 300px; border: 10px solid #ddd;
-moz-border-radius: 10px;
-webkit-border-radius: 10px; }
</style>
</head>
<body>
<h1>Sample Editor as a Component</h1>
<div id="editor" class="bespin"
data-bespinoptions='{ "stealFocus": true }'>
// The text of this div shows up in the editor.
var thisCode = "what shows up in the editor";
function editMe() {
alert("and have fun!");
}
</div>
<script>
window.onBespinLoad = function() {
console.log("this is called when Bespin is loaded");
};
</script>
</body>
</html>
That HTML page gives you something like this:
With Bespin Embedded, The Fearless can go back to focusing on features they’re creating for their users, secure in the knowledge that getting the editor running and keeping it up to date will no longer be a challenge. For everyone who has been interested in using the Bespin editor component but turned away because of lack of documentation or a downloadable release, now is the time to take another look.
If you are interested in embedding Bespin in your own apps, please download the preview release and let us know what you think.
– Kevin Dangoor, on behalf of the Bespin team
Tags: releases
