Как замаскировать текущую страницу за модальным диалоговым окном в vanilla GWT?

Question

Я создал композитный файл для входа в систему, который я показываю пользователю в своей точке входа в приложение. После ввода имени пользователя и пароля я отправляю имя пользователя и пароль на сервер через RemoteService и получу обратно объект, содержащий ClientSession. Если ClientSession является допустимым объектом (распознанным именем пользователя и паролем), я хочу отобразить основную панель приложения, в противном случае я хочу снова отобразить диалоговое окно входа в систему (с сообщением об ошибке).

Мой вопрос заключается в том, как во время асинхронного вызова к серверу как замаскировать экран, чтобы пользователь не мог ничего щелкать, пока сеанс получен с сервера?

Я знаю, что вход в систему должен быть быстрым, но объект Session содержит множество кэшированных значений на стороне клиента для текущего пользователя, который используется для генерации главной панели. Это может занять доли секунды или до 5 секунд (к сожалению, я не могу контролировать скорость базовой инфраструктуры), поэтому я хочу замаскировать экран до истечения времени ожидания, а затем позволить пользователю повторить попытку.

Я проделал эту точную операцию перед использованием GWT Ext, но, к сожалению, в ванильном GWT сэмплов намного меньше.

Спасибо

Chris

Answer 1

Класс GWT PopupPanel имеет дополнительную «стеклянную панель», которая блокирует взаимодействие со страницей внизу.

final PopupPanel popup = new PopupPanel(false, true); // Create a modal dialog box that will not auto-hide
popup.add(new Label("Please wait"));
popup.setGlassEnabled(true); // Enable the glass panel
popup.center(); // Center the popup and make it visible

Answer 2

Это мое решение:

public class CustomPopupPanel extends PopupPanel {

    private Label label = new Label();

    public CustomPopupPanel() {
        super(false, true); // Create a modal dialog box that will not auto-hide
        super.setGlassEnabled(true); // Enable the glass panel
        super.add(label); // Add the widget label into the panel
    }

    public CustomPopupPanel(String text) {
        this();
        this.mask(text);
    }

    public final void mask(String text) {
        label.setText(text);
        super.center(); // Center the popup and make it visible
    }

    public void unmask() {
        super.hide(); // Hide the popup
    }
}

Answer 3

Вы также можете использовать диалоговое окно для этой цели.Вот код, как его использовать.

public class NTMaskAlert extends DialogBox {

private String displayText;
private String message;
private static NTMaskAlert alert;
Label lable;

private NTMaskAlert(String text) {
    setText(text);
    setWidget(new Image(GWT.getModuleBaseURL()
            + "/images/ajax-loader_1.gif"));
    setGlassEnabled(true);
    setAnimationEnabled(true);
    super.show();
    super.center();
    WorkFlowSessionFactory.putValue(WorkFlowSesisonKey.MASKING_PANEL, this);
}

public static void mask(String text) {
    if (text != null)
        new NTMaskAlert(text);
    else
        new NTMaskAlert("Processing");
}

public static void unMask() {
    NTMaskAlert alert = (NTMaskAlert) WorkFlowSessionFactory
            .getValue(WorkFlowSesisonKey.MASKING_PANEL);
    if (alert != null) {
        alert.hide();
        alert = null;
    }
}

public void setDisplayText(String displayText) {
    this.displayText = displayText;
    alert.setText(displayText);
}

public String getDisplayText() {
    return displayText;
}

public void setMessage(String message) {
    this.message = message;
    lable.setText(message);
}

public String getMessage() {
    return message;
}

}

Использовать статическую маску и метод снятия маски для операций.

Answer 4

Возможно, вы захотите проверить GlassPanel из проекта GWT Incubator .AFAICT это не идеально, но, тем не менее, должно помочь;)