Use drag and drop in Fridge app.

src/server/gwt/.classpath

@@ -3,5 +3,6 @@
 	<classpathentry kind="src" path="src"/>
 	<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER"/>
 	<classpathentry kind="lib" path="/Users/bringert/src/gwt-mac-1.5.3/gwt-user.jar"/>
+	<classpathentry kind="lib" path="lib/gwt-dnd-2.5.6.jar"/>
 	<classpathentry kind="output" path="src"/>
 </classpath>

src/server/gwt/Fridge-compile

@@ -14,4 +14,6 @@ if [ `uname` = "Darwin" ]; then
   GWT_JAVA_OPTS=-XstartOnFirstThread
 fi
 
-java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$GWT_CLASSPATH" com.google.gwt.dev.GWTCompiler -out "$APPDIR/www" "$@" se.chalmers.cs.gf.gwt.FridgeApp;
+LIBS=$APPDIR/lib/gwt-dnd-2.5.6.jar
+
+java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$LIBS:$GWT_CLASSPATH" com.google.gwt.dev.GWTCompiler -out "$APPDIR/www" "$@" se.chalmers.cs.gf.gwt.FridgeApp;

src/server/gwt/Fridge-shell-external

@@ -14,4 +14,6 @@ if [ `uname` = "Darwin" ]; then
   GWT_JAVA_OPTS=-XstartOnFirstThread
 fi
 
-java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$GWT_CLASSPATH" com.google.gwt.dev.GWTShell -out "$APPDIR/www" -noserver "$@" http://localhost:41296/gwt/www/se.chalmers.cs.gf.gwt.FridgeApp/Fridge.html;
+LIBS=$APPDIR/lib/gwt-dnd-2.5.6.jar
+
+java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$LIBS:$GWT_CLASSPATH" com.google.gwt.dev.GWTShell -out "$APPDIR/www" -noserver "$@" http://localhost:41296/gwt/www/se.chalmers.cs.gf.gwt.FridgeApp/Fridge.html;

src/server/gwt/Translate-compile

@@ -14,4 +14,6 @@ if [ `uname` = "Darwin" ]; then
   GWT_JAVA_OPTS=-XstartOnFirstThread
 fi
 
-java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$GWT_CLASSPATH" com.google.gwt.dev.GWTCompiler -out "$APPDIR/www" "$@" se.chalmers.cs.gf.gwt.TranslateApp;
+LIBS=$APPDIR/lib/gwt-dnd-2.5.6.jar
+
+java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$LIBS:$GWT_CLASSPATH" com.google.gwt.dev.GWTCompiler -out "$APPDIR/www" "$@" se.chalmers.cs.gf.gwt.TranslateApp;

src/server/gwt/Translate-shell-external

@@ -14,4 +14,6 @@ if [ `uname` = "Darwin" ]; then
   GWT_JAVA_OPTS=-XstartOnFirstThread
 fi
 
-java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$GWT_CLASSPATH" com.google.gwt.dev.GWTShell -out "$APPDIR/www" -noserver "$@" http://localhost:41296/gwt/www/se.chalmers.cs.gf.gwt.TranslateApp/Translate.html;
+LIBS=$APPDIR/lib/gwt-dnd-2.5.6.jar
+
+java $GWT_JAVA_OPTS -Xmx256M -cp "$APPDIR/src:$APPDIR/bin:$LIBS:$GWT_CLASSPATH" com.google.gwt.dev.GWTShell -out "$APPDIR/www" -noserver "$@" http://localhost:41296/gwt/www/se.chalmers.cs.gf.gwt.TranslateApp/Translate.html;

src/server/gwt/src/se/chalmers/cs/gf/gwt/FridgeApp.gwt.xml

@@ -14,6 +14,9 @@
 
       <!-- Other module inherits                                      -->
       
+      <!-- Inherit gwt-dnd support                   -->
+      <inherits name='com.allen_sauer.gwt.dnd.gwt-dnd'/>
+
 
       <!-- Specify the app entry point class.                         -->
       <entry-point class="se.chalmers.cs.gf.gwt.client.FridgeApp" />

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/FridgeApp.java

@@ -1,27 +1,32 @@
 package se.chalmers.cs.gf.gwt.client;
 
+import com.allen_sauer.gwt.dnd.client.PickupDragController;
+import com.allen_sauer.gwt.dnd.client.drop.DropController;
+import com.google.gwt.user.client.History;
 import com.google.gwt.user.client.ui.Button;
+import com.google.gwt.user.client.ui.ChangeListener;
 import com.google.gwt.user.client.ui.ClickListener;
-import com.google.gwt.user.client.ui.FlowPanel;
-import com.google.gwt.user.client.ui.HasText;
 import com.google.gwt.user.client.ui.HorizontalPanel;
 import com.google.gwt.user.client.ui.Hyperlink;
-import com.google.gwt.user.client.ui.Label;
 import com.google.gwt.user.client.ui.Panel;
+import com.google.gwt.user.client.ui.RootPanel;
 import com.google.gwt.user.client.ui.VerticalPanel;
 import com.google.gwt.user.client.ui.Widget;
 
 
 public class FridgeApp extends TranslateApp {
 
-	private FlowPanel bagPanel;
+	private FridgeBagPanel bagPanel;
+	private FridgeTextPanel textPanel;
+
+	private MagnetFactory magnetFactory;
 
 	//
 	// Text
 	//
 
 	protected void update () {
-		updateBag();
+		bagPanel.updateBag(getText());
 		translate();
 	}
 
@@ -47,90 +52,32 @@ public class FridgeApp extends TranslateApp {
 		return pgf.getPGFName() + "/" + language + "/" + text;
 	}
 
-	private void updateBag () {
-		updateBag("");
-	}
-
-	private void updateBag (String prefix) {
-		int limit = 100;
-		pgf.complete(getText() + " " + prefix, 
-				limit, new PGF.CompleteCallback() {
-			public void onResult(PGF.Completions completions) {
-				bagPanel.clear();
-				for (PGF.Completion completion : completions.iterable()) {
-					String text = completion.getText();
-					if (!completion.getText().equals(getText() + " ")) {
-						String[] words = text.split("\\s+");
-						String word = (words.length > 0) ? words[words.length - 1] : "";
-						String token = makeToken(completion.getFrom(), text);
-						Hyperlink magnet = new Hyperlink(word, token);
-						magnet.addStyleName("my-Magnet");
-						bagPanel.add(magnet);
-					}
-				}
-				if (bagPanel.getWidgetCount() == 0) {
-					bagPanel.add(new Label("<empty>"));
-				}
-			}
-			public void onError(Throwable e) {
-				showError("Error getting completions.", e);
-			}
-		});
-	}
-
 	//
 	// Current text
 	//
 
-	private class TextPanel extends FlowPanel implements HasText {
-
-		public TextPanel () { }
-
-		public String getText () {
-			StringBuilder sb = new StringBuilder();
-			for (Widget w : this) {
-				String word = ((UsedMagnet)w).getText();	
-				if (sb.length() > 0) {
-					sb.append(' ');
-				}
-				sb.append(word);			
-			}
-			return sb.toString();
-		}
-
-		public void setText (String text) {
-			String inputLanguage = pgf.getInputLanguage();
-			clear();
-			for (String word : text.split("\\s+")) {
-				if (word.length() > 0) {
-					add(new UsedMagnet(inputLanguage, word));
-				}
-			}
-		}
-
-	}
-
 	private void clear() {
-		setText("");
+		textPanel.clear();
 	}
 
-	//
+
 	// History stuff
-	//
 
 	protected void updateSettingsFromHistoryToken(String[] tokenParts) {
 		super.updateSettingsFromHistoryToken(tokenParts);
 		if (tokenParts.length >= 3 && tokenParts[2].length() > 0) {
-			textSource.setText(tokenParts[2]);
+			setText(tokenParts[2]);
 			update();
 		}
 	}
 
-	//
-	// GUI
-	//
 
-	protected Widget createTranslationUI() {
+	// GUI
+
+	protected Widget createUI() {
+		PickupDragController dragController = new PickupDragController(RootPanel.get(), false);
+		magnetFactory = new MagnetFactory(dragController);
+
 		VerticalPanel vPanel = new VerticalPanel();
 		vPanel.setWidth("100%");
 		vPanel.setHorizontalAlignment(VerticalPanel.ALIGN_CENTER);
@@ -139,12 +86,20 @@ public class FridgeApp extends TranslateApp {
 		vPanel.add(createBagPanel());
 		vPanel.add(createSettingsPanel());
 		vPanel.add(createTranslationsPanel());
+
+		DropController dropController = new FridgeTextPanelDropController(textPanel);
+		dragController.registerDropController(dropController);
+
 		return vPanel;
 	}
 
 	protected Widget createTextPanel () {
-		TextPanel textPanel = new TextPanel();		
+		textPanel = new FridgeTextPanel(magnetFactory);		
-		textPanel.setStylePrimaryName("my-TextPanel");
+		textPanel.addChangeListener(new ChangeListener() {
+			public void onChange(Widget widget) {
+				update();
+			}
+		});
 
 		textSource = textPanel;
 
@@ -162,17 +117,23 @@ public class FridgeApp extends TranslateApp {
 	}
 
 	protected Widget createBagPanel () {
-		bagPanel = new FlowPanel();
+		bagPanel = new FridgeBagPanel(pgf, magnetFactory);
-		bagPanel.setStylePrimaryName("my-BagPanel");
 		return bagPanel;
 	}
 
-	//
+
 	// Initialization
-	//
 
 	public void onModuleLoad() {
-		super.onModuleLoad();
+		statusPopup = new StatusPopup();
+
+		pgf = new PGFWrapper(new PGF(pgfBaseURL), new MySettingsListener());
+
+		RootPanel.get().add(createUI());
+
+		History.addHistoryListener(new MyHistoryListener());
+
+		updateSettingsFromHistoryToken();
 	}
 
 }

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/FridgeBagPanel.java

@@ -0,0 +1,53 @@
+package se.chalmers.cs.gf.gwt.client;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.FlowPanel;
+
+public class FridgeBagPanel extends Composite {
+
+	private PGFWrapper pgf;
+
+	private MagnetFactory magnetFactory;
+	
+	private FlowPanel mainPanel;
+
+	public FridgeBagPanel (PGFWrapper pgf, MagnetFactory magnetFactory) {
+		this.pgf = pgf;
+		this.magnetFactory = magnetFactory;
+		mainPanel = new FlowPanel();
+		initWidget(mainPanel);
+		setStylePrimaryName("my-FridgeBagPanel");
+	}
+
+	public void updateBag (String text) {
+		updateBag(text, "");
+	}
+
+	public void updateBag (String text, String prefix) {
+		mainPanel.clear();
+		int limit = 100;
+		pgf.complete(text + " " + prefix, 
+				limit, new PGF.CompleteCallback() {
+			public void onResult(PGF.Completions completions) {
+				mainPanel.clear();
+				for (PGF.Completion completion : completions.iterable()) {
+					String text = completion.getText();
+					if (!completion.getText().equals(text + " ")) {
+						String[] words = text.split("\\s+");
+						if (words.length > 0) {
+							String word = words[words.length - 1];
+							Magnet magnet = magnetFactory.createMagnet(word);
+							mainPanel.add(magnet);
+						}
+					}
+				}
+			}
+			public void onError(Throwable e) {
+				// FIXME: show message to user?
+				GWT.log("Error getting completions.", e); 
+			}
+		});
+	}
+
+}

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/FridgeTextPanel.java

@@ -0,0 +1,75 @@
+package se.chalmers.cs.gf.gwt.client;
+
+import com.google.gwt.user.client.ui.ChangeListener;
+import com.google.gwt.user.client.ui.ChangeListenerCollection;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.FlowPanel;
+import com.google.gwt.user.client.ui.HasText;
+import com.google.gwt.user.client.ui.Panel;
+import com.google.gwt.user.client.ui.Widget;
+
+public class FridgeTextPanel extends Composite implements HasText {
+
+	private MagnetFactory magnetFactory;
+	
+	private Panel mainPanel;
+
+	private ChangeListenerCollection listeners = null;
+
+	public FridgeTextPanel (MagnetFactory magnetFactory) { 
+		this.magnetFactory = magnetFactory;
+		mainPanel = new FlowPanel();
+		initWidget(mainPanel);
+		setStylePrimaryName("my-FridgeTextPanel");
+	}
+
+	public void setEngaged(boolean engaged) {
+		if (engaged) {
+			addStyleDependentName("engage");
+		} else {
+			removeStyleDependentName("engage");
+		}
+	}
+	
+	public String getText () {
+		StringBuilder sb = new StringBuilder();
+		for (Widget w : mainPanel) {
+			String word = ((Magnet)w).getText();	
+			if (sb.length() > 0) {
+				sb.append(' ');
+			}
+			sb.append(word);			
+		}
+		return sb.toString();
+	}
+
+	public void setText (String text) {
+		clear();
+		for (String word : text.split("\\s+")) {
+			if (word.length() > 0) {
+				addMagnet(magnetFactory.createMagnet(word));
+			}
+		}
+	}
+
+	public void clear () {
+		mainPanel.clear();
+		fireChange();
+	}
+
+	public void addMagnet (Magnet magnet) {
+		mainPanel.add(magnet);
+		fireChange();
+	}
+
+	protected void fireChange() {
+		listeners.fireChange(this);
+	}
+	
+	public void addChangeListener(ChangeListener listener) {
+		if (listeners == null) {
+			listeners = new ChangeListenerCollection();
+		}
+		listeners.add(listener);
+	}
+}

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/FridgeTextPanelDropController.java

@@ -0,0 +1,34 @@
+package se.chalmers.cs.gf.gwt.client;
+
+import com.allen_sauer.gwt.dnd.client.DragContext;
+import com.allen_sauer.gwt.dnd.client.drop.SimpleDropController;
+import com.google.gwt.user.client.ui.Widget;
+
+public class FridgeTextPanelDropController extends SimpleDropController {
+
+	private FridgeTextPanel textPanel;
+
+	public FridgeTextPanelDropController (FridgeTextPanel textPanel) {
+		super(textPanel);
+		this.textPanel = textPanel;
+	}
+
+	public void onEnter(DragContext context) {
+		super.onEnter(context);
+		textPanel.setEngaged(true);
+	}
+
+	public void onLeave(DragContext context) {
+		textPanel.setEngaged(false);
+		super.onLeave(context);
+	}
+
+	public void onDrop(DragContext context) {
+		for (Widget widget : context.selectedWidgets) {
+			Magnet magnet = (Magnet)widget;
+			textPanel.addMagnet(magnet);
+		}
+		super.onDrop(context);
+	}
+
+}

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/Magnet.java

@@ -0,0 +1,12 @@
+package se.chalmers.cs.gf.gwt.client;
+
+import com.google.gwt.user.client.ui.Label;
+
+public class Magnet extends Label {
+	
+	public Magnet (String text) {
+		setText(text);
+		setStylePrimaryName("my-Magnet");
+	}
+
+}

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/MagnetFactory.java

@@ -0,0 +1,19 @@
+package se.chalmers.cs.gf.gwt.client;
+
+import com.allen_sauer.gwt.dnd.client.PickupDragController;
+
+public class MagnetFactory {
+
+	private PickupDragController dragController;
+	
+	public MagnetFactory (PickupDragController dragController) {
+		this.dragController = dragController;
+	}
+	
+	public Magnet createMagnet(String text) {
+		Magnet magnet = new Magnet(text);
+		dragController.makeDraggable(magnet);
+		return magnet;
+	}
+	
+}

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/TranslateApp.java

@@ -15,12 +15,10 @@ import com.google.gwt.user.client.ui.Widget;
 
 public class TranslateApp implements EntryPoint {
 
-	private static final String pgfBaseURL = "/pgf";
+	protected static final String pgfBaseURL = "/pgf";
 
 	protected PGFWrapper pgf;
 
-	protected Widget translationUI;
-
 	protected HasText textSource;
 	protected VerticalPanel outputPanel;
 	protected StatusPopup statusPopup;
@@ -93,7 +91,7 @@ public class TranslateApp implements EntryPoint {
 	// GUI
 	//
 	
-	protected Widget createTranslationUI() {
+	protected Widget createUI() {
 		VerticalPanel vPanel = new VerticalPanel();
 		vPanel.setWidth("100%");
 		vPanel.setHorizontalAlignment(VerticalPanel.ALIGN_CENTER);
@@ -138,7 +136,7 @@ public class TranslateApp implements EntryPoint {
 	// History stuff
 	//
 	
-	private HistoryListener historyListener = new HistoryListener() {
+	protected class MyHistoryListener implements HistoryListener {
 		public void onHistoryChanged(String historyToken) {
 			updateSettingsFromHistoryToken();
 		}
@@ -182,8 +180,6 @@ public class TranslateApp implements EntryPoint {
 					pgf.setPGFName(grammars.get(0));
 				}
 			}			
-			RootPanel.get().clear();
-			RootPanel.get().add(translationUI);
 		}
 		public void onAvailableLanguagesChanged() {
 			if (pgf.getInputLanguage() == null) {
@@ -209,13 +205,11 @@ public class TranslateApp implements EntryPoint {
 	public void onModuleLoad() {
 		statusPopup = new StatusPopup();
 
-		RootPanel.get().add(createLoadingWidget());
-
 		pgf = new PGFWrapper(new PGF(pgfBaseURL), new MySettingsListener());
 		
-		translationUI = createTranslationUI();
+		RootPanel.get().add(createUI());
 
-		History.addHistoryListener(historyListener);
+		History.addHistoryListener(new MyHistoryListener());
 
 		updateSettingsFromHistoryToken();
 	}

src/server/gwt/src/se/chalmers/cs/gf/gwt/client/UsedMagnet.java

@@ -1,20 +0,0 @@
-package se.chalmers.cs.gf.gwt.client;
-
-import com.google.gwt.user.client.ui.Composite;
-import com.google.gwt.user.client.ui.Label;
-
-public class UsedMagnet extends Composite {
-
-	private String word;
-	
-	public UsedMagnet(String language, String word) {
-		this.word = word;
-		initWidget(new Label(word));
-		setStylePrimaryName("my-UsedMagnet");
-	}
-	
-	public String getText() {
-		return word;
-	}
-	
-}

src/server/gwt/src/se/chalmers/cs/gf/gwt/public/Fridge.css

@@ -2,23 +2,31 @@ body {
   background: url("brushed-metal.png");
 }
 
-.my-TextPanel, .my-BagPanel, .my-translations, .my-SettingsPanel {
+.my-FridgeTextPanel, .my-FridgeBagPanel, .my-translations, .my-SettingsPanel {
   margin: 1em;
 }
 
-.my-TextPanel {
+.my-FridgeTextPanel, .my-FridgeBagPanel {
-  font-size: 150%;
   min-height: 2em;
+  padding: 0.2em;
+  overflow: auto;
+}
+
+.my-FridgeTextPanel {
+  font-size: 150%;
   border: 3px dashed #dddddd;
-  overflow: auto;
 }
 
-.my-BagPanel {
+.my-FridgeTextPanel-engage {
+  border-color: #aaaaaa;
+  background-color: #ccff99;
+}
+
+.my-FridgeBagPanel {
   border: 3px solid #dddddd;
-  overflow: auto;
 }
 
-.my-Magnet, .my-UsedMagnet {
+.my-Magnet {
   float: left;
   margin: 0.3em;
   border-width: 1px;
@@ -29,11 +37,6 @@ body {
   background-color: white;
 }
 
-.my-Magnet a, .my-UsedMagnet a {
-  color: black;
-  text-decoration: none;
-}
-
 .my-translations {
   border: 1px solid silver;
 }