using ACE editor from Google Web Toolkit
JavaScript Java
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.settings
ace-gwt-editor
ace-gwt-webapp
.classpath
.project
README
pom.xml

README

Use ACE Editor from GWT


1. Include dependency in your project

    <dependency>
    	<groupId>ace</groupId>
    	<artifactId>ace-gwt-editor</artifactId>
    	<version>1.0-SNAPSHOT</version>
    	<type>jar</type>
    	<scope>compile</scope>
    </dependency>

2. Inherit module in GWT configuration file (*.gwt.xml)

      <inherits name='ace.Editor'/>

3. Copy ACE didtribution (src forlder) in your webapp 

4. Include JS and add the RootPanel div in your Application.html

  <head>
	<script src="src/ace.js" type="text/javascript" charset="utf-8"></script>
	<script src="src/theme-twilight.js" type="text/javascript" charset="utf-8"></script>
	<script src="src/mode-javascript.js" type="text/javascript" charset="utf-8"></script>
  </head>

  <body>

	<div id="toolbar"></div>
	<div id="editor">
	function main() { 
		return 'hello world!';
	}
	</div>
	
  </body>
</html>

5. finally create JSEditor in your main class

/**
 * Entry point classes define <code>onModuleLoad()</code>.
 */
public class Application implements EntryPoint
{

  /**
   * This is the entry point method.
   */
  public void onModuleLoad()
  {
	  
	  
	  final JSEditor editor = new JSEditor();

	 editor.addHandler( new JSEditorHandler() {

		public void onSave(JSEditorEvent<?> event) {
			Window.alert( "save ");
		}
		 
	 });
	  
	  editor.getProxy().setTheme("ace/theme/twilight");
	 
  }
}