Example usage for com.google.gwt.user.client.ui FlexTable FlexTable

List of usage examples for com.google.gwt.user.client.ui FlexTable FlexTable

  1. HOME
  2. Java
  3. com.google.gwt
  4. com.google.gwt.user.client.ui.*
  5. FlexTable
  6. FlexTable

Introduction

In this page you can find the example usage for com.google.gwt.user.client.ui FlexTable FlexTable.

Prototype

public FlexTable()

Source Link

Usage

From source file:com.edgenius.wiki.gwt.client.editor.MCEInsertTableDialog.java

License:Open Source License

/**
 * @param tiny/*from   w w  w. j a  va  2 s  . co  m*/
 */
public MCEInsertTableDialog(TinyMCE tiny, boolean update) {
    super(tiny);
    this.update = update;
    this.setText(Msg.consts.insert_table());

    FlexTable options = new FlexTable();

    options.setWidget(0, 0, asTable);
    options.setWidget(0, 1, asGrid);
    asTable.setValue(true);
    asTable.addClickHandler(this);
    asGrid.addClickHandler(this);
    options.getFlexCellFormatter().setHorizontalAlignment(0, 0, HasHorizontalAlignment.ALIGN_CENTER);
    options.getFlexCellFormatter().setHorizontalAlignment(0, 1, HasHorizontalAlignment.ALIGN_CENTER);
    options.setStyleName(Css.OPTIONS);

    FlexTable tableParamLayout = new FlexTable();
    tableParamLayout.setWidget(0, 0, new Label(Msg.consts.rows()));
    tableParamLayout.setWidget(0, 1, rows);

    tableParamLayout.setWidget(0, 2, new Label(Msg.consts.cols()));
    tableParamLayout.setWidget(0, 3, cols);

    tableParamLayout.setWidget(1, 0, new Label(Msg.consts.bk_color()));
    tableParamLayout.setWidget(1, 1, bkPicker);

    tableParamLayout.setWidget(1, 2, new Label(Msg.consts.border_color()));
    tableParamLayout.setWidget(1, 3, borderPicker);

    tableParamLayout.setWidget(2, 0, new Label(Msg.consts.border()));
    tableParamLayout.setWidget(2, 1, border);

    tableParamLayout.setWidget(2, 2, hasTitle);
    tableParamLayout.getFlexCellFormatter().setColSpan(2, 2, 2);

    tableParamLayout.getColumnFormatter().setWidth(0, "120px");
    tableParamLayout.getColumnFormatter().setWidth(2, "120px");
    rows.setStyleName(Css.TINY_TEXT_BOX);
    cols.setStyleName(Css.TINY_TEXT_BOX);
    border.setStyleName(Css.TINY_TEXT_BOX);

    FlexTable gridParamLayout = new FlexTable();
    gridParamLayout.setWidget(0, 0, new Label(Msg.consts.rows()));
    gridParamLayout.setWidget(0, 1, gridRows);

    gridParamLayout.setWidget(0, 2, new Label(Msg.consts.cols()));
    gridParamLayout.setWidget(0, 3, gridCols);
    gridRows.setStyleName(Css.TINY_TEXT_BOX);
    gridCols.setStyleName(Css.TINY_TEXT_BOX);

    tableParamLayout.setWidth("100%");
    tableParamLayout.setCellSpacing(5);
    gridParamLayout.setWidth("100%");
    gridParamLayout.setCellSpacing(5);
    options.setWidth("100%");
    options.setCellSpacing(5);
    deck.setWidth("100%");

    deck.insert(tableParamLayout, 0);
    deck.insert(gridParamLayout, 1);

    if (update) {
        JsArrayString list = getProperties();
        if (list.get(8).toLowerCase().indexOf("macrogrid") != -1) {
            asGrid.setValue(true);
            gridRows.setText(list.get(0));
            gridCols.setText(list.get(1));
            //set it to same value for switch back
            rows.setText(list.get(0));
            cols.setText(list.get(1));
            //disable some unable to change attributes
            gridRows.setEnabled(false);
            gridCols.setEnabled(false);
            deck.showWidget(1);
        } else {
            asTable.setValue(true);
            deck.showWidget(0);
            //this sequence is according to method getProperties() on  table.js in TinyMCE table plugin
            rows.setText(list.get(0));
            cols.setText(list.get(1));
            gridRows.setText(list.get(0));
            gridCols.setText(list.get(1));

            final String color = StringUtil.isBlank(list.get(2)) ? SharedConstants.TABLE_BG_DEFAULT_COLOR
                    : list.get(2);
            if (GwtClientUtils.isIE()) {
                Scheduler.get().scheduleDeferred(new ScheduledCommand() {
                    public void execute() {
                        //stupid IE need this deferred set
                        bkPicker.setColor(color);
                    }
                });
            } else
                bkPicker.setColor(color);
            final String bcolor = StringUtil.isBlank(list.get(3)) ? SharedConstants.TABLE_BORDER_DEFAULT_COLOR
                    : list.get(3);
            if (GwtClientUtils.isIE()) {
                Scheduler.get().scheduleDeferred(new ScheduledCommand() {
                    public void execute() {
                        //stupid IE need this deferred set
                        borderPicker.setColor(bcolor);
                    }
                });
            } else
                borderPicker.setColor(bcolor);

            hasTitle.setValue(BooleanUtil.toBoolean(list.get(4)));
            width = GwtUtils.removeUnit(list.get(5));
            height = GwtUtils.removeUnit(list.get(6));
            String borderS = GwtUtils.removeUnit(list.get(7));
            border.setText(StringUtil.isBlank(borderS) ? DEFAULT_BORDER_SIZE + "" : borderS);

            //disable some unable to change attributes
            rows.setEnabled(false);
            cols.setEnabled(false);
        }
    } else {
        //initial values
        gridRows.setText("1");
        gridCols.setText("3");

        rows.setText("2");
        cols.setText("2");
        border.setText("1");
        hasTitle.setValue(true);
        deck.showWidget(0);

        Scheduler.get().scheduleDeferred(new ScheduledCommand() {
            public void execute() {
                rows.setFocus(true);
            }
        });
    }

    VerticalPanel form = new VerticalPanel();
    form.setWidth("100%");
    form.add(options);
    form.add(deck);
    this.setWidget(form);

}

From source file:com.edgenius.wiki.gwt.client.editor.MCELinkDialog.java

License:Open Source License

public MCELinkDialog(final TinyMCE tiny) {
    super(tiny);/*from  w  ww . j  a va 2 s. c om*/
    request.addCallback(this);

    this.setText(Msg.consts.insert_link());
    Label l1 = new Label(Msg.consts.link_url());
    Label l2 = new Label(Msg.consts.space());
    Label l3 = new Label(Msg.consts.page());

    FlexTable layout = new FlexTable();
    layout.setWidget(0, 0, l2);
    layout.setWidget(0, 1, spaceBox);

    layout.setWidget(1, 0, l3);
    layout.setWidget(1, 1, pageBox);

    Hr sep = new Hr();
    layout.setWidget(2, 0, sep);
    layout.getFlexCellFormatter().setColSpan(2, 0, 2);

    layout.setWidget(3, 0, l1);
    layout.setWidget(3, 1, extLinkBox);

    VerticalPanel panel = new VerticalPanel();
    panel.add(message);
    panel.add(layout);

    panel.setSize("100%", "100%");
    layout.setSize("100%", "100%");
    l1.setStyleName(Css.FORM_LABEL);
    l2.setStyleName(Css.FORM_LABEL);
    l3.setStyleName(Css.FORM_LABEL);
    sep.setStyleName(Css.SEPARATOR);
    extLinkBox.setStyleName(Css.FORM_INPUT);
    spaceBox.setStyleName(Css.FORM_INPUT);
    pageBox.setStyleName(Css.FORM_INPUT);
    this.setWidget(panel);

    //can not use spaceBox.onLostFocus() to decide when get PageList, as spaceBox is suggest box, a popup suggest box
    //will trigger the focus event, but at the moment, the space input not finish yet...
    pageBox.addFocusHandler(new FocusHandler() {
        public void onFocus(FocusEvent event) {
            String spaceUname = StringUtil.trim(spaceBox.getText());

            if (!StringUtil.equalsIgnoreCase(spaceUname, currSpaceUname)) {
                pageBox.request(spaceUname);
                currSpaceUname = spaceUname;
            }
        }

    });

    Scheduler.get().scheduleDeferred(new ScheduledCommand() {
        public void execute() {
            pageBox.setFocus(true);
        }
    });

    //initial request for current space
    //just put it as blank so that comparing with spaceBox.getText()
    currSpaceUname = "";
    pageBox.request(StringUtil.trim(tiny.getSpaceUname()));
}

From source file:com.edgenius.wiki.gwt.client.editor.MCEMacroDialog.java

License:Open Source License

public MCEMacroDialog(TinyMCE tiny, String type, String... params) {
    super(tiny);//www.j av a 2 s .  co  m
    this.type = type;

    VerticalPanel main = new VerticalPanel();
    FlexTable layout = new FlexTable();
    main.add(message);
    main.add(layout);

    if (TYPE_USER.equalsIgnoreCase(type)) {
        this.setText(Msg.consts.insert() + " " + Msg.consts.user());
        Label l1 = new Label(Msg.consts.user());
        l1.setStyleName(Css.FORM_LABEL);
        layout.setWidget(0, 0, l1);
        layout.setWidget(0, 1, hbox);
        hbox.setHint(Msg.consts.user_name());
        focusHintBox();
    } else if (TYPE_GALLERY.equalsIgnoreCase(type)) {
        this.setText(Msg.consts.insert() + " Gallery");
        Label l1 = new Label(Msg.consts.filter());
        l1.setStyleName(Css.FORM_LABEL);
        layout.setWidget(0, 0, l1);
        layout.setWidget(0, 1, hbox);
        hbox.setHint(Msg.consts.gallery_hint());
        focusHintBox();
    } else if (TYPE_ATTACH.equalsIgnoreCase(type)) {
        this.setText(Msg.consts.insert() + " Attachment list");
        Label l1 = new Label(Msg.consts.filter());
        l1.setStyleName(Css.FORM_LABEL);
        layout.setWidget(0, 0, l1);
        layout.setWidget(0, 1, hbox);
        hbox.setHint(Msg.consts.attach_hint());
        focusHintBox();
    } else if (TYPE_HTML.equalsIgnoreCase(type)) {
        this.setText(Msg.consts.insert() + " HTML");
        layout.setWidget(0, 0, area);
        area.setStyleName(Css.LARGE);
        focusTextArea();
    } else if (TYPE_PANEL.equalsIgnoreCase(type)) {
        this.setText(Msg.consts.insert() + " Panel");
        Label l1 = new Label(Msg.consts.title());
        l1.setStyleName(Css.FORM_LABEL);
        layout.setWidget(0, 0, l1);
        layout.setWidget(0, 1, hbox);
        focusHintBox();
        //no hint text in hbox, so it can be put focus... need improve later...
        Scheduler.get().scheduleDeferred(new ScheduledCommand() {
            public void execute() {
                hbox.setFocus(true);
            }
        });
    } else if (TYPE_TOC.equalsIgnoreCase(type)) {
        this.setText(Msg.consts.insert() + " Table of Contents");
        Label l1 = new Label(Msg.consts.levels());
        l1.setStyleName(Css.FORM_LABEL);
        layout.setWidget(0, 0, l1);
        layout.setWidget(0, 1, hbox);
        hbox.setHint("3");

        Label l2 = new Label(Msg.consts.type());
        l2.setStyleName(Css.FORM_LABEL);
        layout.setWidget(1, 0, l2);
        radio1.setText(Msg.consts.numbers());
        radio2.setText(Msg.consts.bullets());
        radio1.setChecked(true);
        FlowPanel pl = new FlowPanel();
        pl.add(radio1);
        pl.add(new HTML("   "));
        pl.add(radio2);
        layout.setWidget(1, 1, pl);
        focusHintBox();
    }
    hbox.setStyleName(Css.FORM_INPUT);

    this.setWidget(main);
}

From source file:com.edgenius.wiki.gwt.client.editor.MCEMacroMessageDialog.java

License:Open Source License

public MCEMacroMessageDialog(TinyMCE tiny, String type) {
    super(tiny);/*  w w w . ja  v a2s.  com*/
    this.type = type.toLowerCase();

    this.setText(Msg.consts.insert() + " " + type + " " + Msg.consts.macro());

    Label l1 = new Label(Msg.consts.title());
    Label l2 = new Label(Msg.consts.content());

    int row = 0;
    FlexTable panel = new FlexTable();
    //      panel.setWidget(row, 0, message);
    //      panel.getFlexCellFormatter().setColSpan(row, 0, 2);
    //      row++;

    panel.setWidget(row, 0, l1);
    panel.setWidget(row, 1, title);
    row++;

    panel.setWidget(row, 0, l2);
    panel.setWidget(row, 1, content);

    l1.setStyleName(Css.FORM_LABEL);
    l2.setStyleName(Css.FORM_LABEL);
    title.setStyleName(Css.FORM_INPUT);
    content.setStyleName(Css.DESC);

    this.setWidget(panel);
}

From source file:com.edgenius.wiki.gwt.client.editor.MCEMergeCellsDialog.java

License:Open Source License

/**
 * @param tiny/*from  ww w  . j  a  va 2s .c o m*/
 */
public MCEMergeCellsDialog(TinyMCE tiny) {
    super(tiny);

    this.setText(Msg.consts.merge_cells());
    Label rowLabel = new Label(Msg.consts.rows());
    Label colLabel = new Label(Msg.consts.cols());

    FlexTable layout = new FlexTable();
    layout.setWidget(0, 0, rowLabel);
    layout.setWidget(0, 1, rowBox);

    layout.setWidget(1, 0, colLabel);
    layout.setWidget(1, 1, colBox);

    layout.setSize("100%", "100%");
    colLabel.setStyleName(Css.FORM_LABEL);
    rowLabel.setStyleName(Css.FORM_LABEL);
    rowBox.setStyleName(Css.FORM_INPUT);
    colBox.setStyleName(Css.FORM_INPUT);

    FormPanel form = new FormPanel();
    form.setWidget(layout);
    this.setWidget(form);

    Scheduler.get().scheduleDeferred(new ScheduledCommand() {
        public void execute() {
            rowBox.setFocus(true);
        }
    });
    init();
}

From source file:com.edgenius.wiki.gwt.client.login.SignupForm.java

License:Open Source License

/**
 * Used in user signup and system admin adds new user
 * @param dialog /*www  .j a va2 s.  c o  m*/
 * @param sender 
 * @param redirUrl 
 */
public SignupForm(DialogBox dialog, Button sender, String redirUrl) {
    this.dialog = dialog;
    this.sender = sender;
    this.redirUrl = redirUrl;
    form.setMethod(FormPanel.METHOD_POST);
    form.addSubmitHandler(this);

    FlexTable inputPanel = new FlexTable();
    profile.userInfo(inputPanel, form, PersonalProfile.STYLE_SIGNUP);

    VerticalPanel panel = new VerticalPanel();
    panel.add(message);
    panel.add(inputPanel);

    panel.setVerticalAlignment(HasVerticalAlignment.ALIGN_BOTTOM);
    panel.setSize("450px", "100%");

    form.setWidget(panel);

    this.setWidget(form);
}

From source file:com.edgenius.wiki.gwt.client.page.EditPanel.java

License:Open Source License

public EditPanel(final PageMain main) {
    super(main);/*from  w  w  w. j ava 2  s  . c  o m*/

    main.addPanelSwitchListener(this);

    contentArea = new Editor(main, false);
    main.editorRegistry.register(contentArea);

    titleBox.setTabIndex(1);
    if (!AbstractEntryPoint.isOffline()) {
        tagBox.setTabIndex(2);
    }
    contentArea.setTabIndex(3);
    tagBox.setHint(Msg.consts.tags() + "...");

    titleBox.addBlurHandler(new BlurHandler() {
        public void onBlur(BlurEvent event) {
            //display the final saved title
            titleBox.setText(StringUtil.shrinkSpaces(titleBox.getText()));

            validSave();
        }
    });

    if (!AbstractEntryPoint.isOffline()) {
        templatePanel = new TemplatesPanel(main, this);
        templatePanel.setVisible(false);
        templateBtn.addClickHandler(new ClickHandler() {
            public void onClick(ClickEvent event) {
                //toggle template panel
                templatePanel.toggle();
            }
        });
    }

    //       Label titleLabel = new Label(Msg.consts.title());

    //attachment
    attPanel = new AttachmentPanel(main, false);
    attachmentBtn = new AttachmentButton(attPanel);
    contentArea.bindAttachmentPanel(attPanel);

    //must put below above 2 sentences: attPanel is created 
    main.registerAttachmentPanel(attPanel);

    //tag, att, location, notification 
    //       Label tagLabel = new Label(Msg.consts.tags());
    noticeCheckbox.setValue(true);

    //content
    ContentChangeListener changeListener = new ContentChangeListener();
    contentArea.addKeyPressHandler(changeListener);
    contentArea.addChangeHandler(changeListener);

    //hide first, show when fillPanel() according to PageAttribute.NO_ATTACHMENT
    attachmentBtn.setVisible(false);
    //hide attachment initial
    attPanel.setVisible(false);

    titleBox.setStyleName(Css.TITLE_BOX);

    draftStatusBar.setStyleName(Css.DRAFT_STATUS_MSG);

    //main content panel, contains contentPanel, diffContent and SideBar panel.
    FlexTable mainPanel = new FlexTable();
    mainPanel.setCellPadding(0);
    mainPanel.setCellSpacing(0);
    mainPanel.setWidget(0, 0, contentArea);
    mainPanel.setWidget(0, 1, diffContent);

    mainPanel.getCellFormatter().setAlignment(0, 0, HasHorizontalAlignment.ALIGN_LEFT,
            HasVerticalAlignment.ALIGN_TOP);
    mainPanel.getCellFormatter().setAlignment(0, 1, HasHorizontalAlignment.ALIGN_LEFT,
            HasVerticalAlignment.ALIGN_TOP);
    mainPanel.setWidth("100%");

    diffMessage.setVisible(false);
    //build panel
    HTMLPanel hpanel = new HTMLPanel(readEditLayout());
    hpanel.add(message, "_message");
    hpanel.add(diffMessage, "_diff_message");
    hpanel.add(titleBox, "_title");
    hpanel.add(draftStatusBar, "_draft_message");
    if (!AbstractEntryPoint.isOffline()) {
        hpanel.add(tagBox, "_tags");
        hpanel.add(noticeCheckbox, "_notification");
    }
    hpanel.add(functionBtnBar, "_actions");
    hpanel.add(attachmentBtn, "_attchments");
    hpanel.add(attPanel, "_attchments_panel");
    if (!AbstractEntryPoint.isOffline()) {
        templateBtn.setStyleName(Css.ATT_BTN);
        hpanel.add(templateBtn, "_templates");
        hpanel.add(templatePanel, "_templates_panel");
    }
    hpanel.add(mainPanel, "_body");

    this.setWidget(hpanel);
}

From source file:com.edgenius.wiki.gwt.client.page.EditSidebarPanel.java

License:Open Source License

public EditSidebarPanel(PageMain main) {
    this.main = main;
    main.addPanelSwitchListener(this);

    contentArea = new Editor(main, false);
    main.editorRegistry.register(contentArea);
    ContentChangeListener changeListener = new ContentChangeListener();
    contentArea.addKeyPressHandler(changeListener);
    contentArea.addChangeHandler(changeListener);

    functionBtnBar = new FunctionWidget(main);

    VerticalPanel optionPanel = new VerticalPanel();
    optionPanel.add(new Label(Msg.consts.stick_sidebar_editing()));
    optionPanel.add(radio1);/* www  .  ja va 2 s . c o  m*/
    optionPanel.add(radio2);
    optionPanel.add(radio3);

    optionPanel.add(new HTML(Msg.consts.sidebar_tip()));

    FlexTable mainPanel = new FlexTable();
    mainPanel.setWidget(0, 0, contentArea);
    mainPanel.setWidget(0, 1, optionPanel);

    mainPanel.getColumnFormatter().setStyleName(1, Css.SIDEBAR_OPTIONS);

    FlexTable headerPanel = new FlexTable();
    headerPanel.setWidget(0, 0, title);
    headerPanel.setWidget(0, 1, functionBtnBar);

    title.setStyleName(Css.RENDER_TITLE);
    mainPanel.getCellFormatter().setAlignment(0, 0, HasHorizontalAlignment.ALIGN_LEFT,
            HasVerticalAlignment.ALIGN_TOP);
    mainPanel.getCellFormatter().setAlignment(0, 1, HasHorizontalAlignment.ALIGN_LEFT,
            HasVerticalAlignment.ALIGN_TOP);

    //main
    VerticalPanel panel = new VerticalPanel();
    headerPanel.setWidth("100%");
    mainPanel.setWidth("100%");
    optionPanel.setSize("100%", "100%");
    panel.setWidth("100%");

    panel.add(message);
    panel.add(headerPanel);
    panel.add(mainPanel);
    this.setWidget(panel);
}

From source file:com.edgenius.wiki.gwt.client.page.EditTemplatePanel.java

License:Open Source License

public EditTemplatePanel(PageMain main) {
    this.main = main;
    main.addPanelSwitchListener(this);
    contentArea = new Editor(main, false);
    main.editorRegistry.register(contentArea);

    ContentChangeListener changeListener = new ContentChangeListener();
    contentArea.addKeyPressHandler(changeListener);
    contentArea.addChangeHandler(changeListener);

    functionBtnBar = new FunctionWidget(main);
    functionBtnBarPreview = new FunctionWidget(main);
    title.addKeyPressHandler(new KeyPressHandler() {
        public void onKeyPress(KeyPressEvent event) {
            String text = title.getText();
            if (text.length() > TITLE_MAX_LEN) {
                title.setText(text.substring(0, TITLE_MAX_LEN));
                status.setText(Msg.params.title_length("" + TITLE_MAX_LEN));
            }/*from w  w w.  j a  v a  2  s  . c  om*/
            if (validSave()) {
                status.removeStyleName(Css.ERROR);
                title.removeStyleName(Css.ERROR);
                status.setText("");
            }
        }
    });
    FlexTable headerPanel = new FlexTable();
    FlowPanel f1 = new FlowPanel();
    f1.add(title);
    f1.add(status);
    headerPanel.setWidget(0, 0, f1);
    headerPanel.setWidget(0, 1, functionBtnBar);
    title.setStyleName(Css.TITLE_BOX);

    FlowPanel f2 = new FlowPanel();
    f2.add(desc);
    f2.add(shared);
    headerPanel.setWidget(1, 0, f2);
    headerPanel.getFlexCellFormatter().setColSpan(1, 0, 2);
    desc.setStyleName(Css.DESC);

    headerPanel.setStyleName(Css.TEMPLATE_HEADER);
    headerPanel.getRowFormatter().setStyleName(0, Css.EDIT_TITLE_PANEL);
    headerPanel.getRowFormatter().setStyleName(1, Css.EDIT_TAG_PANEL);

    //main
    VerticalPanel panel = new VerticalPanel();
    headerPanel.setWidth("100%");
    panel.setWidth("100%");

    VerticalPanel editPanel = new VerticalPanel();
    editPanel.add(headerPanel);
    editPanel.add(contentArea);
    editPanel.setWidth("100%");

    VerticalPanel previewPanel = new VerticalPanel();
    FlexTable previewHeaderPanel = new FlexTable();
    previewHeaderPanel.setWidget(0, 0, previewTitle);
    previewHeaderPanel.setWidget(0, 1, functionBtnBarPreview);
    //      previewHeaderPanel.setWidget(1, 0, previewDesc);
    //      previewHeaderPanel.getFlexCellFormatter().setColSpan(1, 0, 2);
    previewHeaderPanel.setWidth("100%");
    previewPanel.setWidth("100%");

    previewPanel.add(previewHeaderPanel);
    previewPanel.add(previewContent);

    previewPanel.setStyleName(Css.PREVIEW);
    previewTitle.setStyleName(Css.RENDER_TITLE);
    //      previewDesc.setStyleName(Css.HEADING3);

    deck.insert(editPanel, 0);
    deck.insert(previewPanel, 1);
    deck.showWidget(0);

    panel.add(message);
    panel.add(deck);
    this.setWidget(panel);

}

From source file:com.edgenius.wiki.gwt.client.page.ViewPanel.java

License:Open Source License

/**
 * @param main/*www . j  a v a  2s .c  o m*/
 * @return
 */
private HTMLPanel buildViewPanel(final PageMain main) {

    //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    // Attachment and PrettyURL
    attPanel = new AttachmentPanel(main, true);
    attachmentBtn = new AttachmentButton(attPanel);
    pUrlBtn = new PrettyUrlButton(pUrlPanel);
    pUrlPanel.setVisible(false);
    attPanel.setVisible(false);
    main.registerAttachmentPanel(attPanel);

    //turn on/off depends on the login status
    favorite.setVisible(false);
    watch.setVisible(false);

    title.setStyleName(Css.RENDER_TITLE);

    //main content panel, contains contentPanel, diffContent and SideBar panel.
    FlexTable mainPanel = new FlexTable();
    mainPanel.setWidget(0, 0, contentPanel);
    mainPanel.setWidget(0, 1, diffContent);

    mainPanel.getCellFormatter().setAlignment(0, 0, HasHorizontalAlignment.ALIGN_LEFT,
            HasVerticalAlignment.ALIGN_TOP);
    mainPanel.getCellFormatter().setAlignment(0, 1, HasHorizontalAlignment.ALIGN_LEFT,
            HasVerticalAlignment.ALIGN_TOP);
    mainPanel.setWidth("100%");

    diffMessage.setVisible(false);
    //build panel
    tabPanel = new PageTabPanel(main);

    HTMLPanel hpanel = new HTMLPanel(readViewLayout());
    hpanel.add(spaceMenu, "_spacemenu");
    hpanel.add(message, "_message");
    hpanel.add(diffMessage, "_diff_message");
    hpanel.add(title, "_title");
    hpanel.add(tags, "_tags");
    hpanel.add(functionBtnBar, "_actions");
    hpanel.add(attachmentBtn, "_attchments");
    hpanel.add(attPanel, "_attchments_panel");
    hpanel.add(pUrlBtn, "_urls");
    hpanel.add(pUrlPanel, "_urls_panel");
    hpanel.add(mainPanel, "_body");
    hpanel.add(favorite, "_favorite");
    hpanel.add(watch, "_watch");
    hpanel.add(rssFeedBtn, "_rss");
    hpanel.add(exportBtn, "_export");
    //history,comment, summary tab panel.
    hpanel.add(tabPanel, "_tabs");

    return hpanel;
}