View source for Labs/Bespin/UserGuide

=Disclaimer=

Please consider that <font style="color:red;">this documentation is still under hard development</font>, and may change. This documentation is for Bespin version 0.1.1 "Naughty Nimbus" but it will be updated as new releases come out.

=What is Bespin?=

Bespin is an experiment in trying to create a web-based web-focused extensible code editor from Mozilla Labs. It's made by Dion Almaer and Ben Galbraith. This editor is based on new technologies regarding HTML 5.

=How can I use Bespin=

==Requisites==

To use Bespin, it's recommended that you use [http://mozilla.org/firefox Firefox] or [http://webkit.org Webkit Nightly Builds] browsers.

Despite of this, Bespin should work in every modern browser that supports HTML 5 property "Canvas" (this excludes Internet Explorer), has a text rendering API, and support JavaScript.

Browsers that support Bespin:

*Firefox 3.x
*Webkit Nightly Builds (development version of Safari)
*Google Chromium (development version of Chrome)

Browsers NOT supported:

*Internet Explorer
*Google Chrome 1.x
*Opera 9.6x
*SeaMonkey
*Camino 1.6.6
*KHTML (Konqueror)

==Making an account==

To use Bespin you must create an account into [http://bespin.mozilla.com Bespin Website] and then log in. You'll be facing your Dashboard, <i>welcome aboard the cloud</i>!

==Installing Bespin Locally==

<font style="color:red;">ATTENTION: This section will be moved to the Developer Guide when it's ready.</font>

If you don't want to use Bespin 'in the cloud' you can install an instance of it in your computer. Or maybe you want to install it for a local network.

This section is still in development.

===Python API===

Firstly, you will need to grab the source. If you have mercurial installed then just do a 

  hg clone http://hg.mozilla.org/labs/bespin/

Otherwise just download the tarball and extract it somewhere in you home directory.

Once your have everything on your hard disk open a terminal and go into the Bespin directory. Then change into the backend folder

  cd backend/python

and install all the requirements with 

  python bootstrap.py 

This will take a few moments. After it is finished configure your installation and start the local server with the following three commands:

  source bin/activate
  paver create_db
  paver start

If  you see something like Server starting on localhost:8080 in the terminal it means everything went well and you are good to go. Just point your browser to http://localhost:8080 and off you go.

===Java API===

This section is still in development.

=Dashboard=

The Dashboard is the main view of your projects, files, opened sessions, and statistics (in a future version). 

==Projects==

This section is still in development.

===Importing===

You can import projects to your Bespin account from the web. To import a project you can do:

  import <project name> <url with file>

Projects must be hosted on-line and compressed in ZIP or TAR.GZ formats.

===Exporting===

To export a project to your computer you can do:

  export <project name> <archivetype>

<nowiki><archivetype></nowiki> can be ZIP or TGZ. If archivetype is not passed it defaults to ZIP

===Version Control===

Not supported in this version. It will be available in version 0.2 (See [[Labs/Bespin/Roadmap|Roadmap]])

==File View==

The file view opens up when you click on any project. You can open a file by double clicking on it.

==Open Sessions==

This is where opened files appear. Every file shown here is still active, and you can access it by double clicking on it.

It's stablished on the [[Labs/Bespin/Roadmap|Roadmap]] that every file will contain information about date, last modification, etc.

=Editor=

This is the main editor. You can edit your files here. It has syntax highlighting and the most commons tools for an editor:

*Cut/Copy/Paste
*Preview on Web (does not work on Webkit)
*Undo/Redo
*Save/Close
*Change font size
*Line numbering

==Collaboration==

Not included in this version. It will be available in version 0.3 (See  [[Labs/Bespin/Roadmap|Roadmap]])

==Syntax Highlighting==

Right now only CSS, JavaScript and HTML hightlighting is supported. This will be improved in a near future.

=Command Line=

It shows at the bottom of the page. Here you can type some commands to do things that are not available trough the UI.

==Commands==

===Global Commands===

<i>alias</i> [alias] [command] This creates an alias between a word you want with a command p.e.:

  alias close closefile

This creates an alias that closes without saving the file you are currently working.

<i>set</i> [parameter]: This sets values to the configuration. If parameter is not passed a list with the available variables will be displayed. To change a parameter value you can do:

  set <variable> <value>

For example:

  set theme white

<i>projects</i>: Show a list with your projects.

<i>help</i>: Displays a list with the available commands.

===Dashboard Specific Commands===

<i>history</i>: Shows the command history.

<i>version</i>: Shows Bespin version.

<i>files</i> [project]: Shows the files inside a given project.

===Editor Specific Commands===

<font style="color:red;">Some commands still missing</font>

<i>clear</i> - Clear the content of the file.

<i>closefile</i> (<font style="color:#55F;">file</font>) - If file parameter is passed, closes the specified file, if not, closes the current open file.

<i>clipboard</i> - Saves the file contents into the clipboard.

<i>dashboard</i> - Go back to the Dashboard

<i>editconfig</i> - Open the configuration file for the editor.

<i>goto</i> (<font style="color:#55F;">line number</font>) - Moves cursor to the desired line number.

<i>load</i> (<font style="color:#55F;">filename</font>) - Loads the file specified in (<font style="color:#55F;">filename</font>)

<i>logout</i> - Logout the editor.

<i>newfile</i> (<font style="color:#55F;">filename</font>) - Creates a new file with the name specified in [filename]

<i>preview</i> (<font style="color:#55F;">filename</font>) - Preview the file in the web browser (does not work on Webkit)

<i>project</i> (<font style="color:#55F;">name</font>) - Creates a project with the desired name

=Keyboard Shortcuts=

Note: The keyboard shortcuts are the same for Windows, GNU/Linux and Mac OS, there is no Cmd equivalent.

Control-J: Takes you to the command line.

==Emacs Style Shortcuts==

There are some shortcuts implemented that are similar to Emacs. They are:

*Control-B: Move cursor left
*Control-F: Move cursor right
*Control-P: Move cursor up
*Control-N: Move cursor down
*Control-A: Move cursor to line start
*Control-E: Move cursor to line end

=User Configuration=

==Configuration File==

You can access to it typing in the command line:

  editconfig

This will open a new file called "config.js"

==Settings==

Parameters that you can change via <i>set</i>:

<i>collaborate</i> [on|off]: Set collaboration mode. Default value: off

<i>syntax</i> [auto|css|html|javascript]: Set the highlighting language. Default value: auto.

<i>autocomplete</i> [on|off]: Set command autocompletion. Default value: off

<i>theme</i> [name]: Change theme. Currently there are only three suported themes. See [[#Themes|Themes]] section for more info.

<i>fontsize</i> [number]: Change default font size. Default value: 10

<i>keybindings</i> [emacs]: Set emacs style keybindings

Example:

  set autocomplete on

==Themes==

Only three themes are currently supported:

*Coffee (default)
*White
*Black

You can change between themes typing in the command line:

  set theme <theme-name>

=Frecuently Asked Questions=

You can see them [[Labs/Bespin/FAQ|here]]

=Tips and Tricks=

You can see them [[Labs/Bespin/Tips|here]]

=Known Issues=

You can see them [[Labs/Bespin/KnownIssues|here]]

=Bug Reporting=

Have you find a bug? Tell us! [https://bugzilla.mozilla.org/buglist.cgi?query_format=specific&order=relevance+desc&bug_status=__open__&content=Bespin Make a bug report]