High performance web code editor for GWT
Java JavaScript Groovy XML
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.



High performance web code editor for GWT.

ahome-ace is a java API for the Ace Editor. If you want to embed a powerful web based editor in a GWT application, ahome-ace might be what you're looking for!

The editor comes with a lot of nice feratures:

  • Fully integrate with GWT Widgets.
  • UI Binder support
  • Syntax highlighting for over 110 languages (TextMate/Sublime Text.tmlanguage files can be imported)
  • Over 20 themes (TextMate/Sublime Text .tmtheme files can be imported)
  • Automatic indent and outdent
  • An optional command line
  • Handles huge documents (four million lines seems to be the limit!)
  • Fully customizable key bindings including vim and Emacs modes
  • Search and replace with regular expressions
  • Highlight matching parentheses
  • Toggle between soft tabs and real tabs
  • Displays hidden characters
  • Drag and drop text using the mouse
  • Line wrapping
  • Code folding
  • Multiple cursors and selections
  • Live syntax checker (currently JavaScript/CoffeeScript/CSS/XQuery)
  • Cut, copy, and paste functionality
  • And more to come ...

The following components are required to work with ahome-ace:

  • GWT 2.5 and higher
  • ahome-core project

Getting started with ahome-ace

1) The project does'nt not have a binary. So one will have to build a jar file from source and add it to the classpath

2) Inherit the ahome-ace module

  <inherits name="com.ait.toolkit.ace.AhomeAce"/>

3) Below is an example how to use the widget.In this example we use our ahome-ext library but ahome-ace is compatible with any GWT library.

package com.ait.toolkit.clientio.demo.client;
package com.ait.toolkit.clientio.demo.client;

import com.ait.toolkit.ace.client.AceEditor;
import com.ait.toolkit.ace.client.AceEditorMode;
import com.ait.toolkit.ace.client.AceEditorOptions;
import com.ait.toolkit.ace.client.AceEditorTheme;
import com.ait.toolkit.sencha.ext.client.core.ExtEntryPoint;
import com.ait.toolkit.sencha.ext.client.layout.Layout;
import com.ait.toolkit.sencha.ext.client.ui.Window;

public class AceTest extends ExtEntryPoint {

    private AceEditor edior;

    public void onLoad() {

        Window w = new Window("ACE Editor");
        w.setSize(700, 400);

        edior = new AceEditor();

        AceEditorOptions options = new AceEditorOptions();
        // options.setEnableBasicAutocompletion(true);



4) ahome-ace also works nicely with GWT's UI Binder

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:ace="urn:import:com.ait.toolkit.ace.client" >

    <x:Window ui:field="window" title="ACE Editor demo" layout="fit" componentHeight="400" componentWidth="700">
       <ace:AceEditor  ui:field="editor"  theme="twilight" mode="javascript" />

package com.ait.toolkit.clientio.demo.client;

import com.ait.toolkit.ace.client.AceEditor;
import com.ait.toolkit.ace.client.events.BlurEvent;
import com.ait.toolkit.sencha.ext.client.events.component.ShowEvent;
import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.uibinder.client.UiHandler;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Widget;

public class AceDemo extends Composite {

    private static AceDemoUiBinder uiBinder = GWT.create(AceDemoUiBinder.class);

    interface AceDemoUiBinder extends UiBinder<Widget, AceDemo> {

    com.ait.toolkit.sencha.ext.client.ui.Window window;

    AceEditor editor;

    public AceDemo() {

    public com.ait.toolkit.sencha.ext.client.ui.Window getWindow() {
        return window;

    public AceEditor getEditor() {
        return editor;

    public void handlerShow(ShowEvent e) {
        Window.alert("Show event");

    public void handlerBlur(BlurEvent e) {
        Window.alert("blur event");


Real world Demo

Issues tracking


Enterprise Support

Get high quality support through Ahomé