X-Git-Url: https://code.grnet.gr/git/pithos-web-client/blobdiff_plain/9e7e7872e832956e67f9b4bd3e813bd4166256c5..67cc91134cb3cd21d151be6064259386f6389fef:/src/gr/grnet/pithos/web/client/InvitationsDialog.java

diff --git a/src/gr/grnet/pithos/web/client/InvitationsDialog.java b/src/gr/grnet/pithos/web/client/InvitationsDialog.java
index f72ad3b..d4a5635 100644
--- a/src/gr/grnet/pithos/web/client/InvitationsDialog.java
+++ b/src/gr/grnet/pithos/web/client/InvitationsDialog.java
@@ -52,26 +52,31 @@ import com.google.gwt.user.client.ui.FlexTable;
 import com.google.gwt.user.client.ui.HTML;
 import com.google.gwt.user.client.ui.HasHorizontalAlignment;
 import com.google.gwt.user.client.ui.HorizontalPanel;
+import com.google.gwt.user.client.ui.Image;
 import com.google.gwt.user.client.ui.TextBox;
 import com.google.gwt.user.client.ui.VerticalPanel;
+import com.google.gwt.user.client.ui.Widget;
 
 
 /**
  * A dialog box that displays info about invitations
  */
 public class InvitationsDialog extends DialogBox {
-
-	private final String WIDTH_FIELD = "35em";
-	private final String WIDTH_TEXT = "42em";
-
-	Pithos app;
-	TextBox name;
-	TextBox emailBox;
+	private static final int INV_PER_PAGE = 5;
 	
+	Pithos app;
+	VerticalPanel messagesPanel;
+	int rows = 0;
+	FlexTable sentInvitationsTable;	
+	/**
+	 * The current displayed page of sent invitations 
+	 */
+	int currentPage = 0;
+	HorizontalPanel pagerPanel;	
 	/**
 	 * The widget constructor.
 	 */
-	public InvitationsDialog(Pithos _app, Invitations inv) {
+	public InvitationsDialog(Pithos _app, final Invitations inv) {
 		this.app = _app;
 		Anchor close = new Anchor();
 		close.addStyleName("close");
@@ -83,74 +88,181 @@ public class InvitationsDialog extends DialogBox {
 			}
 		});
 		// Set the dialog's caption.
-		setText("Invite people (" + inv.getInvitationsLeft() + " invitations left)");
+		setText("Invite friends");
 		setAnimationEnabled(true);
 		setGlassEnabled(true);
 		setStyleName("pithos-DialogBox");
 		VerticalPanel outer = new VerticalPanel();
-		outer.add(close);
+		outer.addStyleName("outer");
+		outer.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_LEFT);
 
 		VerticalPanel inner = new VerticalPanel();
 		inner.addStyleName("inner");
 		// Create the text and set a style name so we can style it with CSS.
-		HTML text = new HTML("You have " + inv.getInvitationsLeft() + " invitations left in your account.");
-		text.setStyleName("pithos-credentialsText");
-		text.setWidth(WIDTH_TEXT);
+		HTML text = new HTML("You have <span class='pithos-leftInvitationsNumber'>" + inv.getInvitationsLeft() + "</span> invitations left");
+		text.addStyleName("pithos-invitationsLeft");
 		inner.add(text);
-		FlexTable table = new FlexTable();
+		
+		HorizontalPanel split = new HorizontalPanel();
+		split.addStyleName("pithos-invitationsSplitPanel");
+
+		VerticalPanel left = new VerticalPanel();
+		left.addStyleName("pithos-sendInvitationsPanel");
+		left.setVisible(inv.getInvitationsLeft() > 0);
+
+		HorizontalPanel sendLabelPanel = new HorizontalPanel();
+		HTML sendLabel = new HTML("Send new invitations");
+		sendLabel.addStyleName("pithos-sendInvitationsTitle");
+		sendLabelPanel.add(sendLabel);
+		Image plus = new Image("images/plus.png");
+		plus.addStyleName("pithos-addInvitationImg");
+		sendLabelPanel.add(plus);
+		left.add(sendLabelPanel);
+
+		messagesPanel = new VerticalPanel();
+		messagesPanel.setSpacing(5);
+		left.add(messagesPanel);
+		
+		final FlexTable table = new FlexTable();
+		table.setCellSpacing(0);
 		if (inv.getInvitationsLeft() > 0) {
-			table.setText(0, 0, "Name");
-			table.setText(1, 0, "E-mail");
+			table.setHTML(0, 0, "Name <span class='eg'>e.g. John Smith</span>");
+			table.getFlexCellFormatter().setStyleName(0, 0, "props-labels");
+			table.setText(0, 1, "Email");
+			table.getFlexCellFormatter().setStyleName(0, 1, "props-labels");
+			rows = 1;
+			addFormLine(table);
 		}
-		name = new TextBox();
-		name.setWidth(WIDTH_FIELD);
-		name.setVisible(inv.getInvitationsLeft() > 0);
-		table.setWidget(0, 1, name);
-
-		emailBox = new TextBox();
-		emailBox.setWidth(WIDTH_FIELD);
-		emailBox.setVisible(inv.getInvitationsLeft() > 0);
-		table.setWidget(1, 1, emailBox);
+		left.add(table);
+		plus.addClickHandler(new ClickHandler() {
+			
+			@Override
+			public void onClick(ClickEvent event) {
+				if (rows == 0) {
+					table.setHTML(0, 0, "Name <span class='eg'>e.g. John Smith</span>");
+					table.getFlexCellFormatter().setStyleName(0, 0, "props-labels");
+					table.setText(0, 1, "Email");
+					table.getFlexCellFormatter().setStyleName(0, 1, "props-labels");
+					rows++;
+				}
+				addFormLine(table);
+			}
+		});
 
-		table.getFlexCellFormatter().setStyleName(0, 0, "props-labels");
-		table.getFlexCellFormatter().setStyleName(0, 1, "props-values");
-		table.getFlexCellFormatter().setStyleName(1, 0, "props-labels");
-		table.getFlexCellFormatter().setStyleName(1, 1, "props-values");
-		inner.add(table);
+		Button send = new Button("send invitations", new ClickHandler() {
+			@Override
+			public void onClick(ClickEvent event) {
+				int rowCount = table.getRowCount();
+				
+				for (int i = 1; i<rowCount; i++) {
+					String name = ((TextBox) table.getWidget(i, 0)).getText().trim();
+					String email = ((TextBox) table.getWidget(i, 1)).getText().trim();
+					sendInvitation(email, name);
+				}
+			}
+		});
+		send.addStyleName("pithos-sendInvitationButton");
+		send.setVisible(inv.getInvitationsLeft() > 0);
+		left.add(send);
+		
+		split.add(left);
+		split.setCellWidth(left, "50%");
 
-		Button confirm = new Button("Send", new ClickHandler() {
+		VerticalPanel right = new VerticalPanel();
+		right.addStyleName("pithos-sentInvitationsPanel");
+		
+		HTML sentLabel = new HTML("Invitations sent");
+		sentLabel.addStyleName("pithos-sentInvitationsTitle");
+		right.add(sentLabel);
+		
+		sentInvitationsTable = new FlexTable();
+		sentInvitationsTable.setCellSpacing(0);
+		sentInvitationsTable.addStyleName("pithos-sentInvitationsTable");
+		fillSentInvitationsTable(inv);
+		right.add(sentInvitationsTable);
+		
+		pagerPanel = new HorizontalPanel();
+		pagerPanel.setSpacing(5);
+		Button prev = new Button("Prev");
+		prev.addStyleName("pithos-pagerButton");
+		prev.addClickHandler(new ClickHandler() {
+			
 			@Override
 			public void onClick(ClickEvent event) {
-				sendInvitation();
+				if (currentPage > 0) {
+					pagerPanel.getWidget(currentPage + 1).removeStyleName("pithos-pagerButtonCurrent");
+					currentPage--;
+					fillSentInvitationsTable(inv);
+					pagerPanel.getWidget(currentPage + 1).addStyleName("pithos-pagerButtonCurrent");
+				}
 			}
 		});
-		confirm.addStyleName("button");
-		confirm.setVisible(inv.getInvitationsLeft() > 0);
-		inner.add(confirm);
+		pagerPanel.add(prev);
+		Button next = new Button("Next");
+		next.addStyleName("pithos-pagerButton");
+		next.addClickHandler(new ClickHandler() {
+			
+			@Override
+			public void onClick(ClickEvent event) {
+				int numOfInvs = inv.getSentInvitations().size();
+				int numOfPages = numOfInvs / INV_PER_PAGE + (numOfInvs % INV_PER_PAGE == 0 ? 0 : 1);
+				if (currentPage < numOfPages - 1) {
+					pagerPanel.getWidget(currentPage + 1).removeStyleName("pithos-pagerButtonCurrent");
+					currentPage++;
+					pagerPanel.getWidget(currentPage + 1).addStyleName("pithos-pagerButtonCurrent");
+					fillSentInvitationsTable(inv);
+				}
+			}
+		});
+		pagerPanel.add(next);
+		right.add(pagerPanel);
+		updatePagerPanel(inv);
+		
+		split.add(right);
+		
+		inner.add(split);
+		
 		outer.add(inner);
+		outer.add(close);
 		outer.setCellHorizontalAlignment(inner, HasHorizontalAlignment.ALIGN_CENTER);
 		setWidget(outer);
 	}
 
-	@Override
-	protected void onPreviewNativeEvent(NativePreviewEvent preview) {
-		super.onPreviewNativeEvent(preview);
-		NativeEvent evt = preview.getNativeEvent();
-		if (evt.getType().equals("keydown"))
-			// Use the popup's key preview hooks to close the dialog when
-			// either enter or escape is pressed.
-			switch (evt.getKeyCode()) {
-				case KeyCodes.KEY_ENTER:
-					sendInvitation();
-					break;
-				case KeyCodes.KEY_ESCAPE:
-					hide();
-					break;
+	private void addFormLine(final FlexTable table) {
+		table.setWidget(rows, 0, new TextBox());
+		table.getFlexCellFormatter().setStyleName(1, 0, "props-values");
+
+		table.setWidget(rows, 1, new TextBox());
+		table.getFlexCellFormatter().setStyleName(1, 1, "props-values");
+		
+		Image delete = new Image("images/delete.png");
+		delete.addStyleName("pithos-invitationDeleteImg");
+		delete.addClickHandler(new ClickHandler() {
+			
+			@Override
+			public void onClick(ClickEvent event) {
+				int rowIndex = table.getCellForEvent(event).getRowIndex();
+				table.removeRow(rowIndex);
+				if (rowIndex == 1 && table.getRowCount() > 1) {
+					table.getCellFormatter().removeStyleName(rowIndex, 0, "pithos-invitationFormRow");
+					table.getCellFormatter().removeStyleName(rowIndex, 1, "pithos-invitationFormRow");
+					table.getCellFormatter().removeStyleName(rowIndex, 2, "pithos-invitationFormRow");
+				}
+				rows--;
 			}
+		});
+		table.setWidget(rows, 2, delete);
+
+		if (rows > 1) {
+			table.getCellFormatter().addStyleName(rows, 0, "pithos-invitationFormRow");
+			table.getCellFormatter().addStyleName(rows, 1, "pithos-invitationFormRow");
+			table.getCellFormatter().addStyleName(rows, 2, "pithos-invitationFormRow");
+		}
+		rows++;
 	}
 
-	void sendInvitation() {
-		PostRequest sendInvitation = new PostRequest("/im/", "", "invite", "uniq=" + emailBox.getText().trim() + "&realname=" + name.getText().trim()) {
+	void sendInvitation(String email, final String realname) {
+		PostRequest sendInvitation = new PostRequest("/im/", "", "invite", "uniq=" + email + "&realname=" + realname) {
 			
 			@Override
 			protected void onUnauthorized(Response response) {
@@ -159,7 +271,10 @@ public class InvitationsDialog extends DialogBox {
 			
 			@Override
 			public void onSuccess(Resource result) {
-				app.displayInformation("Invitation sent");
+				HTML msg = new HTML("Invitation to <span class='user'>" + realname + "</span> was sent.");
+				msg.addStyleName("pithos-invitationResponse");
+				messagesPanel.add(msg);
+				
 			}
 			
 			@Override
@@ -169,6 +284,62 @@ public class InvitationsDialog extends DialogBox {
 		};
 		sendInvitation.setHeader("X-Auth-Token", app.getToken());
 		Scheduler.get().scheduleDeferred(sendInvitation);
-		hide();
+	}
+	
+	void fillSentInvitationsTable(Invitations inv) {
+		sentInvitationsTable.removeAllRows();
+		int row = 0;
+		for (int j=currentPage * INV_PER_PAGE + 0; j<inv.getSentInvitations().size() && j<(currentPage + 1)* INV_PER_PAGE; j++) {
+			final Invitation i = inv.getSentInvitations().get(j);
+			sentInvitationsTable.setText(row, 0, i.getRealname());
+			if (i.isAccepted())
+				sentInvitationsTable.setWidget(row, 1, new Image("images/invitation_accepted.png"));
+			else {
+				Image img = new Image("images/resend.png");
+				img.addStyleName("pithos-resendInvitation");
+				img.addClickHandler(new ClickHandler() {
+					
+					@Override
+					public void onClick(ClickEvent event) {
+						sendInvitation(i.getEmail(), i.getRealname());
+					}
+				});
+				sentInvitationsTable.setWidget(row, 1, img);
+			}
+			sentInvitationsTable.getFlexCellFormatter().setRowSpan(row, 1, 2);
+			sentInvitationsTable.getFlexCellFormatter().setHorizontalAlignment(row, 1, HasHorizontalAlignment.ALIGN_RIGHT);
+			if (j < inv.getSentInvitations().size() - 1 && j < (currentPage + 1)* INV_PER_PAGE - 1)
+				sentInvitationsTable.getFlexCellFormatter().addStyleName(row, 1, "pithos-invitedEmailBorder");
+			row++;
+			sentInvitationsTable.setText(row, 0, i.getEmail());
+			sentInvitationsTable.getFlexCellFormatter().addStyleName(row, 0, "pithos-invitedEmail");
+			if (j < inv.getSentInvitations().size() - 1 && j < (currentPage + 1)* INV_PER_PAGE - 1)
+				sentInvitationsTable.getFlexCellFormatter().addStyleName(row, 0, "pithos-invitedEmailBorder");
+			row++;
+		}
+	}
+	
+	void updatePagerPanel(final Invitations inv) {
+		int numOfInvitations = inv.getSentInvitations().size();
+		int numOfPages = numOfInvitations / INV_PER_PAGE + (numOfInvitations % INV_PER_PAGE == 0 ? 0 : 1);
+		for (int i=0; i<numOfPages; i++) {
+			final Button page = new Button(String.valueOf(i + 1));
+			page.addStyleName("pithos-pagerButton");
+			if (i == currentPage)
+				page.addStyleName("pithos-pagerButtonCurrent");
+				
+			final int j = i;
+			page.addClickHandler(new ClickHandler() {
+				
+				@Override
+				public void onClick(ClickEvent event) {
+					pagerPanel.getWidget(currentPage + 1).removeStyleName("pithos-pagerButtonCurrent");
+					currentPage = j;
+					fillSentInvitationsTable(inv);
+					page.addStyleName("pithos-pagerButtonCurrent");
+				}
+			});
+			pagerPanel.insert(page, i + 1);
+		}
 	}
 }