Various CSS changes
authorChristos Stathis <chstath@gmail.com>
Tue, 18 Oct 2011 08:02:35 +0000 (11:02 +0300)
committerChristos Stathis <chstath@gmail.com>
Tue, 18 Oct 2011 08:02:35 +0000 (11:02 +0300)
src/gr/grnet/pithos/web/client/Pithos.java
src/gr/grnet/pithos/web/client/PithosCellTable.css
src/gr/grnet/pithos/web/client/PithosCellTreeBasic.css
src/gr/grnet/pithos/web/client/StatusPanel.java
src/gr/grnet/pithos/web/client/TopPanel.java
src/gr/grnet/pithos/web/client/foldertree/FolderTreeView.java
src/gr/grnet/pithos/web/client/foldertree/FolderTreeViewModel.java
src/gr/grnet/pithos/web/client/grouptree/GroupTreeViewModel.java
src/gr/grnet/pithos/web/client/mysharedtree/MysharedTreeViewModel.java
src/gr/grnet/pithos/web/client/othersharedtree/OtherSharedTreeViewModel.java
src/gr/grnet/pithos/web/public/pithos.css

index 9bfde32..75bda35 100644 (file)
@@ -268,27 +268,50 @@ public class Pithos implements EntryPoint, ResizeHandler {
        }
 
     private void initialize() {
-        VerticalPanel outer = new VerticalPanel();
+       boolean bareContent = Window.Location.getParameter("noframe") != null;
+       String contentWidth = bareContent ? "100%" : "75%";
+
+       VerticalPanel outer = new VerticalPanel();
         outer.setWidth("100%");
+       if (!bareContent) {
+               outer.addStyleName("pithos-outer");
+       }
 
-        topPanel = new TopPanel(this, Pithos.images);
-        topPanel.setWidth("100%");
-        outer.add(topPanel);
-        outer.setCellHorizontalAlignment(topPanel, HasHorizontalAlignment.ALIGN_CENTER);
+        if (!bareContent) {
+               topPanel = new TopPanel(this, Pithos.images);
+               topPanel.setWidth("100%");
+               outer.add(topPanel);
+               outer.setCellHorizontalAlignment(topPanel, HasHorizontalAlignment.ALIGN_CENTER);
+        }
         
-        messagePanel.setWidth("75%");
+        messagePanel.setWidth(contentWidth);
         messagePanel.setVisible(false);
         outer.add(messagePanel);
         outer.setCellHorizontalAlignment(messagePanel, HasHorizontalAlignment.ALIGN_CENTER);
 
-
-        // Inner contains the various lists.
-        inner.sinkEvents(Event.ONCONTEXTMENU);
-        inner.setWidth("100%");
-
-        HorizontalPanel rightside = new HorizontalPanel();
-        rightside.addStyleName("pithos-rightSide");
-        rightside.setSpacing(5);
+        HorizontalPanel header = new HorizontalPanel();
+        header.addStyleName("pithos-header");
+        HorizontalPanel leftHeader = new HorizontalPanel();
+        VerticalPanel uploadButtonPanel = new VerticalPanel();
+        upload = new Button("Upload File", new ClickHandler() {
+            @Override
+            public void onClick(@SuppressWarnings("unused") ClickEvent event) {
+                new UploadFileCommand(Pithos.this, null, getSelection()).execute();
+            }
+        });
+        upload.addStyleName("pithos-uploadButton");
+        uploadButtonPanel.add(upload);
+        uploadButtonPanel.setWidth("100%");
+        uploadButtonPanel.setHeight("60px");
+        uploadButtonPanel.setCellHorizontalAlignment(upload, HasHorizontalAlignment.ALIGN_LEFT);
+        uploadButtonPanel.setCellVerticalAlignment(upload, HasVerticalAlignment.ALIGN_MIDDLE);
+        leftHeader.add(uploadButtonPanel);
+        header.add(leftHeader);
+        header.setCellWidth(leftHeader, "35%");
+        
+        HorizontalPanel rightHeader = new HorizontalPanel();
+        rightHeader.addStyleName("pithos-rightSide");
+        rightHeader.setSpacing(5);
 
         toolsButton = new Button(AbstractImagePrototype.create(images.tools()).getHTML());
         toolsButton.addClickHandler(new ClickHandler() {
@@ -302,21 +325,27 @@ public class Pithos implements EntryPoint, ResizeHandler {
                 }
                        }
                });
-        rightside.add(toolsButton);
-        rightside.setCellHorizontalAlignment(toolsButton, HasHorizontalAlignment.ALIGN_LEFT);
+        rightHeader.add(toolsButton);
+        rightHeader.setCellHorizontalAlignment(toolsButton, HasHorizontalAlignment.ALIGN_LEFT);
         
         HorizontalPanel folderStatistics = new HorizontalPanel();
         folderStatistics.addStyleName("pithos-folderStatistics");
         numOfFiles = new HTML();
         folderStatistics.add(numOfFiles);
+        folderStatistics.setCellVerticalAlignment(numOfFiles, HasVerticalAlignment.ALIGN_MIDDLE);
         HTML numOfFilesLabel = new HTML("&nbsp;Files");
         folderStatistics.add(numOfFilesLabel);
-        rightside.add(folderStatistics);
-        rightside.setCellHorizontalAlignment(folderStatistics, HasHorizontalAlignment.ALIGN_RIGHT);
-
-        inner.add(rightside);
-        inner.setCellVerticalAlignment(rightside, HasVerticalAlignment.ALIGN_MIDDLE);
-        inner.setCellHeight(rightside, "60px");
+        folderStatistics.setCellVerticalAlignment(numOfFilesLabel, HasVerticalAlignment.ALIGN_MIDDLE);
+        rightHeader.add(folderStatistics);
+        rightHeader.setCellHorizontalAlignment(folderStatistics, HasHorizontalAlignment.ALIGN_RIGHT);
+        header.add(rightHeader);
+        header.setCellVerticalAlignment(rightHeader, HasVerticalAlignment.ALIGN_MIDDLE);
+        header.setCellHeight(rightHeader, "60px");
+        outer.add(header);
+        outer.setCellHorizontalAlignment(header, HasHorizontalAlignment.ALIGN_CENTER);
+        // Inner contains the various lists.nner
+        inner.sinkEvents(Event.ONCONTEXTMENU);
+        inner.setWidth("100%");
 
         folderTreeSelectionModel = new SingleSelectionModel<Folder>();
         folderTreeSelectionModel.addSelectionChangeHandler(new SelectionChangeEvent.Handler() {
@@ -344,26 +373,13 @@ public class Pithos implements EntryPoint, ResizeHandler {
         trees = new VerticalPanel();
         trees.setWidth("100%");
 
-        VerticalPanel uploadButtonPanel = new VerticalPanel();
-        upload = new Button("Upload File", new ClickHandler() {
-            @Override
-            public void onClick(@SuppressWarnings("unused") ClickEvent event) {
-                new UploadFileCommand(Pithos.this, null, getSelection()).execute();
-            }
-        });
-        uploadButtonPanel.add(upload);
-        uploadButtonPanel.setWidth("100%");
-        uploadButtonPanel.setHeight("60px");
-        uploadButtonPanel.setCellHorizontalAlignment(upload, HasHorizontalAlignment.ALIGN_CENTER);
-        uploadButtonPanel.setCellVerticalAlignment(upload, HasVerticalAlignment.ALIGN_MIDDLE);
-        upload.addStyleName("pithos-uploadButton");
-        trees.add(uploadButtonPanel);
         
         HorizontalPanel treeHeader = new HorizontalPanel();
         treeHeader.addStyleName("pithos-treeHeader");
-        treeHeader.setWidth("100%");
         treeHeader.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
+        treeHeader.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
         HorizontalPanel statistics = new HorizontalPanel();
+        statistics.addStyleName("pithos-statistics");
         statistics.add(new HTML("Total Objects:&nbsp;"));
         totalFiles = new HTML();
         statistics.add(totalFiles);
@@ -389,14 +405,16 @@ public class Pithos implements EntryPoint, ResizeHandler {
         splitPanel.setSplitPosition("35%");
         splitPanel.setSize("100%", "100%");
         splitPanel.addStyleName("pithos-splitPanel");
-        splitPanel.setWidth("75%");
+        splitPanel.setWidth(contentWidth);
         outer.add(splitPanel);
         outer.setCellHorizontalAlignment(splitPanel, HasHorizontalAlignment.ALIGN_CENTER);
 
-        statusPanel = new StatusPanel();
-        statusPanel.setWidth("100%");
-        outer.add(statusPanel);
-        outer.setCellHorizontalAlignment(statusPanel, HasHorizontalAlignment.ALIGN_CENTER);
+        if (!bareContent) {
+               statusPanel = new StatusPanel();
+               statusPanel.setWidth("100%");
+               outer.add(statusPanel);
+               outer.setCellHorizontalAlignment(statusPanel, HasHorizontalAlignment.ALIGN_CENTER);
+        }
 
         // Hook the window resize event, so that we can adjust the UI.
         Window.addResizeHandler(this);
index fdfa014..fb94c32 100644 (file)
 
 .cellTableHeader {
     border:none;
-       font-weight: bold;
        cursor: pointer;
        color: white;
+       background-color: #74aec9;
+       height: 25px;
+       text-shadow: none;
+       font-size: small;
+       font-weight: normal;
 }
 
 .cellTableCell {
@@ -32,6 +36,7 @@
 
 .cellTableFirstColumn {
   padding: 0px;
+  padding-left: 5px;
 }
 
 .cellTableLastColumn {
@@ -78,4 +83,5 @@
 
 .cellTableHoveredRow {
     background: none;
+    background-color: #A1C8DB;
 }
\ No newline at end of file
index 8114a9e..aa1d89f 100644 (file)
@@ -14,7 +14,6 @@
  * the License.
  */
 .cellTreeWidget {
-  
 }
 
 .cellTreeEmptyMessage {
@@ -33,7 +32,6 @@
 }
 
 .cellTreeItemImage {
-  
 }
 
 .cellTreeItemImageValue {
   outline: none;
 }
 
+.cellTreeItemValue:HOVER {
+       background-color: #A1C8DB;
+}
+
 .cellTreeOpenItem {
-  
 }
 
 .cellTreeTopItem {
index baf7204..e186608 100644 (file)
@@ -58,7 +58,7 @@ public class StatusPanel extends Composite {
         inner.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
                HorizontalPanel firstLine = new HorizontalPanel();
                firstLine.setSpacing(8);
-               firstLine.addStyleName("pithos-statusbar");
+//             firstLine.addStyleName("pithos-statusbar");
                firstLine.add(new Anchor("About"));
                firstLine.add(new HTML("|"));
         firstLine.add(new Anchor("Help"));
index efc110e..47ecb1a 100644 (file)
@@ -92,6 +92,7 @@ public class TopPanel extends Composite {
                inner.setVerticalAlignment(HasVerticalAlignment.ALIGN_BOTTOM);
                
                HTML logos = new HTML("<table><tr><td>" + AbstractImagePrototype.create(images.pithosLogo()).getHTML() + "</td></tr></table>");
+               logos.addStyleName("pithos-logo");
                inner.add(logos);
 
         MenuBar username = new MenuBar();
index 39706bd..9a6cc61 100644 (file)
@@ -145,9 +145,12 @@ public class FolderTreeView extends Composite implements TreeView {
     static interface Templates extends SafeHtmlTemplates {
         public Templates INSTANCE = GWT.create(Templates.class);
 
-        @Template("<span>{0}</span>")
+        @Template("<span class='pithos-folderLabel'>{0}</span>")
         public SafeHtml nameSpan(String name);
-      }
+
+        @Template("<span class='pithos-folderLabel'>{0}</span>")
+        public SafeHtml imageSpan(String name);
+    }
 
     private FolderTreeViewModel model;
 
index 0c6efc2..085b496 100644 (file)
@@ -58,6 +58,7 @@ import com.google.gwt.safehtml.shared.SafeHtml;
 import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
 import com.google.gwt.user.client.Command;
 import com.google.gwt.user.client.ui.AbstractImagePrototype;
+import com.google.gwt.user.client.ui.HTML;
 import com.google.gwt.view.client.AsyncDataProvider;
 import com.google.gwt.view.client.HasData;
 import com.google.gwt.view.client.ListDataProvider;
@@ -86,7 +87,7 @@ public class FolderTreeViewModel implements TreeViewModel {
                html = AbstractImagePrototype.create(FolderTreeView.images.folderYellow()).getHTML();
                        name = Templates.INSTANCE.nameSpan(folder.getName());
             }
-            safeHtmlBuilder.appendHtmlConstant(html);
+            safeHtmlBuilder.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
             safeHtmlBuilder.append(name);
         }
 
index b127c89..bf70121 100644 (file)
@@ -65,7 +65,7 @@ public class GroupTreeViewModel implements TreeViewModel {
                @Override
                public void render(@SuppressWarnings("unused") Context context, String value, SafeHtmlBuilder sb) {
             String html = AbstractImagePrototype.create(GroupTreeView.images.groups()).getHTML();
-            sb.appendHtmlConstant(html);
+            sb.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
             sb.append(Templates.INSTANCE.nameSpan(value));
                }
                
@@ -85,7 +85,7 @@ public class GroupTreeViewModel implements TreeViewModel {
                @Override
                public void render(@SuppressWarnings("unused") Context context, Group value, SafeHtmlBuilder sb) {
             String html = AbstractImagePrototype.create(GroupTreeView.images.group()).getHTML();
-            sb.appendHtmlConstant(html);
+            sb.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
             sb.append(Templates.INSTANCE.nameSpan(value.getName()));
                }
                
@@ -105,7 +105,7 @@ public class GroupTreeViewModel implements TreeViewModel {
                @Override
                public void render(@SuppressWarnings("unused") Context context, User value, SafeHtmlBuilder sb) {
             String html = AbstractImagePrototype.create(GroupTreeView.images.user()).getHTML();
-            sb.appendHtmlConstant(html);
+            sb.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
             sb.append(Templates.INSTANCE.nameSpan(value.getName()));
                }
 
index a78748c..ca584f9 100644 (file)
@@ -79,7 +79,7 @@ public class MysharedTreeViewModel implements TreeViewModel {
        @Override
         public void render(@SuppressWarnings("unused") Context context, Folder folder, SafeHtmlBuilder safeHtmlBuilder) {
             String html = AbstractImagePrototype.create(MysharedTreeView.images.folderYellow()).getHTML();
-            safeHtmlBuilder.appendHtmlConstant(html);
+            safeHtmlBuilder.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
             safeHtmlBuilder.append(Templates.INSTANCE.nameSpan(folder.getName()));
         }
 
@@ -136,7 +136,7 @@ public class MysharedTreeViewModel implements TreeViewModel {
                 @Override
                 public void render(String object, SafeHtmlBuilder builder) {
                     String html = AbstractImagePrototype.create(MysharedTreeView.images.myShared()).getHTML();
-                    builder.appendHtmlConstant(html);
+                    builder.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
                     builder.append(MysharedTreeView.Templates.INSTANCE.nameSpan(object));
                 }
             }),  selectionModel2, null);
index e6dd0a2..d71cbe9 100644 (file)
@@ -81,7 +81,7 @@ public class OtherSharedTreeViewModel implements TreeViewModel {
        @Override
         public void render(@SuppressWarnings("unused") Context context, Folder folder, SafeHtmlBuilder safeHtmlBuilder) {
             String html = AbstractImagePrototype.create(OtherSharedTreeView.images.folderYellow()).getHTML();
-            safeHtmlBuilder.appendHtmlConstant(html);
+            safeHtmlBuilder.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
             safeHtmlBuilder.append(Templates.INSTANCE.nameSpan(folder.getName()));
         }
 
@@ -139,7 +139,7 @@ public class OtherSharedTreeViewModel implements TreeViewModel {
                 @Override
                 public void render(String object, SafeHtmlBuilder builder) {
                     String html = AbstractImagePrototype.create(OtherSharedTreeView.images.othersShared()).getHTML();
-                    builder.appendHtmlConstant(html);
+                    builder.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
                     builder.append(OtherSharedTreeView.Templates.INSTANCE.nameSpan(object));
                 }
             }),  selectionModel2, null);
@@ -176,7 +176,7 @@ public class OtherSharedTreeViewModel implements TreeViewModel {
                                        @Override
                                        public void render(String object, SafeHtmlBuilder builder) {
                            String html = AbstractImagePrototype.create(OtherSharedTreeView.images.user()).getHTML();
-                           builder.appendHtmlConstant(html);
+                           builder.appendHtmlConstant(html).appendHtmlConstant("&nbsp;");
                            builder.append(OtherSharedTreeView.Templates.INSTANCE.nameSpan(object));
                                        }
                                }), selectionModel3, null);
index 6028342..98c7e5b 100644 (file)
@@ -1,8 +1,12 @@
 body {
        color: black;
-       font-family: "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
+       font-family: Verdana, 'PT Sans', sans-serif;
+       font-size: 16px;
        margin: 8px;
        margin-top: 3px;
+}
+
+.pithos-outer {
        background: url(images/background.png) repeat-x;
 }
 
@@ -154,8 +158,8 @@ table.pithos-permList.props-labels {
 
 .pithos-topPanel {
        background-color: #4085a5;
-       font-size: 80%;
-       height: 60px;
+       font-size: 75%;
+       height: 59px;
        border-bottom: 1px solid white;
 }
 
@@ -260,7 +264,7 @@ table.pithos-permList.props-labels {
        font-size: 90%;
        vertical-align: middle;
        font-weight: normal;
-       height:145px;
+       height:119px;
        color: white;
 }
 
@@ -269,6 +273,7 @@ table.pithos-permList.props-labels {
        border-collapse: collapse;
        /* prevents selecting text in table with shift and ctrl*/
        -moz-user-select: none;
+       margin-left: 10px;
 }
 
 .pithos-errorMessage {
@@ -313,10 +318,17 @@ table.pithos-permList.props-labels {
 
 .pithos-treeHeader {
        background-color: #74aec9;
+       height: 25px;
+}
+
+.pithos-statistics {
+       color: white;
+       ;
 }
 
 .pithos-splitPanel {
        background: url(images/white50.png);
+       margin-bottom: 34px;
 }
 
 /* Use the background color for the splitter. */
@@ -332,16 +344,22 @@ table.pithos-permList.props-labels {
 
 .pithos-uploadButton {
     background: none;
-    background-color: #ff6600;
-    font-size: 120%;
+    background-color: #ff7f2a;
+    font-size: 100%;
     text-align: center;
-    height: 40px;
-    width: 300px;
+    height: 32px;
+    width: 146px;
+    border: none;
+}
+
+.pithos-uploadButton:HOVER {
+    background-color: #f95;
 }
 
 .pithos-rightSide {
     vertical-align: middle;
     width: 100%;
+    padding-left: 7px;
 }
 .pithos-parentButton {
     background: none;
@@ -352,6 +370,7 @@ table.pithos-permList.props-labels {
     background-color: #a1c8da;
     text-align: center;
     color: white;
+    height: 32px;
 }
 
 .pithos-credentialsText {
@@ -361,3 +380,14 @@ table.pithos-permList.props-labels {
 .grnet-sign {
        color: #72ADC8;
 }
+
+.pithos-logo {
+       position: absolute;
+       top: 25;
+}
+
+.pithos-header {
+       width: 75%;
+       background: url(images/white50.png);
+       margin-top: 34;
+}
\ No newline at end of file