[ovirt-devel] popup dialog

Vojtech Szocs vszocs at redhat.com
Thu Aug 14 13:57:01 UTC 2014



----- Original Message -----
> From: "Leaboy" <wlbleaboy at 126.com>
> To: "Vojtech Szocs" <vszocs at redhat.com>
> Cc: devel at ovirt.org
> Sent: Thursday, August 14, 2014 2:12:37 PM
> Subject: Re: [ovirt-devel] popup dialog
> 
> Hi:
>     you said that ,I have done, and the dialog
> Can display, and I can pass a parameter from dialog
> To the backend executeCommand().
> 
>     Now the question is, after executeCommand(),
> Hou could I get the return value in the frontend.
> 
>     For example, when I clicked backup button,
> A dialog is display, now I type some parameters into
> The dialog, click OK button, the backend executeCommand()
> Do something, now, I need some value from executeCommand()
> to frontend.

Sorry, I missed that your question was about executing backend
command (I thought you referred to Model.executeCommand) ...

Backup dialog's OK button is represented by:

  UICommand tempVar = new UICommand("OnBackup", this);

When user clicks OK button, that ^^ UICommand is executed.
Model's executeCommand should route flow to some onBackup()
method, I assume you already did this:

  // inside TemplateListModel#executeCommand
  ...
  else if ("OnBackup".equals(command.getName())) {
    onBackup();
  }
  ...

  // inside TemplateListModel
  private void onBackup() {
    TemplateBackupModel windowModel = (TemplateBackupModel) getWindow();

    // do nothing if windowModel is already doing something -or- if
    // windowModel validation failed (i.e. bad/missing user input)
    if (windowModel.getProgress() != null || !windowModel.validate()) {
      return;
    }

    // this replaces dialog content UI with "progress" animated image
    // to indicate that a call to backend is about to be initiated
    windowModel.startProgress(null);

    // on backend, assume you have TemplateBackupCommand that works
    // with parameter type TemplateBackupParameters
    TemplateBackupParameters params = new TemplateBackupParameters();
    // update params according to window model
    params.setFoo(windowModel.getFoo().getEntity());

    // this is the async callback executed when backend command
    // (TemplateBackupCommand in our case) has done its job
    IFrontendActionAsyncCallback callback = new IFrontendActionAsyncCallback() {
      @Override
      public void executed(FrontendActionAsyncResult result) {
        TemplateListModel listModel = (TemplateListModel) result.getState();
        listModel.postOnBackup(result.getReturnValue());
      }
    };

    // call backend
    Frontend.getInstance().runAction(
      VdcActionType.TemplateBackup, params, callback, this);
  }

  // still inside TemplateListModel
  private void postOnBackup(VdcReturnValueBase returnValue) {
    // at this point, backend has replied with returnValue,
    // we can remove "progress" animated image in dialog
    getWindow().stopProgress();

    // if the backend operation was successful, close the
    // dialog (otherwise the dialog will remain open)
    if (returnValue != null && returnValue.getSucceeded()) {
      setWindow(null);
    }
  }

Regards,
Vojtech


> 
> 
> 在 8/14/14, 19:48, "Vojtech Szocs" <vszocs at redhat.com> 写入:
> 
> >
> >
> >----- Original Message -----
> >> From: "Leaboy" <wlbleaboy at 126.com>
> >> To: "Vojtech Szocs" <vszocs at redhat.com>
> >> Cc: devel at ovirt.org
> >> Sent: Thursday, August 14, 2014 6:19:17 AM
> >> Subject: Re: [ovirt-devel] popup dialog
> >> 
> >> Hi,Vojtech Szocs:
> >>     Thanks for your help, I have let it work,
> >> 
> >>     The Error I got just because I miss the step 3 you noted.
> >> 
> >> Another question is how could I got the returnValue after
> >> executeCommand , and let the returnValue display on the oher
> >> Popup dialog.
> >
> >Please add this into MainTabTemplateView:
> >
> >  ...
> >  getTable().addActionButton(new
> >WebAdminButtonDefinition<VmTemplate>(constants.templateBackup()) {
> >    @Override
> >    protected UICommand resolveCommand() {
> >      return getMainModel().getTemplateBackupCommand();
> >    }
> >  });
> >  ...
> >
> >This adds a button under "Template" main tab. When clicked, it executes
> >given command (getTemplateBackupCommand) on model (TemplateListModel).
> >
> >Model's executeCommand() ensures that backup() method is called. Inside
> >backup() method, you call setWindow(model) which triggers an event - UI
> >infra handles this event and uses "getModelPopup" (see TemplateModule)
> >to resolve "window model" to GWTP PresenterWidget which is then revealed
> >as popup. This is how dialogs work in UiCommon / UI (GWTP) infra.
> >
> >> how could I got the returnValue after executeCommand
> >
> >As  I wrote above, executeCommand() just calls appropriate method (like
> >backup) on the list model. That method has no return value (void) since
> >it uses setWindow(model) to trigger event to notify UI infra to reveal
> >a dialog.
> >
> >If you need to pass data to dialog, for example:
> >
> >  ...
> >  TemplateBackupModel model = new TemplateBackupModel();
> >  setWindow(model);
> >  ... set window model's title, help tag, hash name ...
> >  model.setSomeData(abc);
> >  model.doSomething();
> >  ...
> >
> >In other words, after you call setWindow(model) you can modify state
> >of window model (TemplateBackupModel) which can be reflected into UI
> >(TemplateBackupPopupView) by use of editor widgets.
> >
> >As for binding window model's (TemplateBackupModel) attributes to UI
> >(TemplateBackupPopupView) fields:
> >
> >  // inside TemplateBackupModel
> >  private EntityModel<String> foo;
> >  public EntityModel<String> getFoo() {
> >    return foo;
> >  }
> >  public void setFoo(EntityModel<String> value) {
> >    foo = value;
> >  }
> >
> >  // inside TemplateBackupPopupView
> >  @UiField
> >  @Path(value = "foo.entity")
> >  StringEntityModelTextBoxEditor fooEditor;
> >
> >Please see DataCenterPopupView.java & DataCenterPopupView.ui.xml
> >(simple dialog view as example) for details.
> >
> >Regards,
> >Vojtech
> >
> >> 
> >> 
> >> 在 8/14/14, 0:07, "Vojtech Szocs" <vszocs at redhat.com> 写入:
> >> 
> >> >Hi,
> >> >
> >> >forgot to mention, one more thing needs to be done:
> >> >
> >> >  // in PresenterModule
> >> >  bindPresenterWidget(TemplateBackupPopupPresenterWidget.class,
> >> >    TemplateBackupPopupPresenterWidget.ViewDef.class,
> >> >    TemplateBackupPopupView.class);
> >> >
> >> >(Above binds popup PresenterWidget/View within GIN DI context.)
> >> >
> >> >Regards,
> >> >Vojtech
> >> >
> >> >
> >> >----- Original Message -----
> >> >> From: "Vojtech Szocs" <vszocs at redhat.com>
> >> >> To: "力波 王" <wlbleaboy at 126.com>
> >> >> Cc: devel at ovirt.org
> >> >> Sent: Wednesday, August 13, 2014 6:00:08 PM
> >> >> Subject: Re: [ovirt-devel] popup dialog
> >> >> 
> >> >> Hi,
> >> >> 
> >> >> in order to add new dialog, follow these steps:
> >> >> 
> >> >> 1, create UiCommon model for the dialog, I see you already did this
> >> >>    (TemplateBackupModel) - however from your code I don't understand
> >> >>    why is there an unused "_asyncQuery" inside model constructor
> >> >>    
> >> >> 2, modify existing list model to trigger your new dialog, I see you
> >> >>    also did this (second code snippet), I assume you put that code
> >> >>    inside TemplateListModel:
> >> >> 
> >> >>   // inside TemplateListModel#backup - this method should be private
> >> >>   // since UI code executes this method via associated UICommand
> >> >>   ...
> >> >>   TemplateBackupModel model = new TemplateBackupModel();
> >> >>   setWindow(model);
> >> >>   
> >> 
> >>>>model.setTitle(ConstantsManager.getInstance().getConstants().templateBa
> >>>>ck
> >> >>upTitle());
> >> >>   model.setHelpTag(HelpTag.template_backup);
> >> >>   model.setHashName("template_backup");//$NON-NLS-1$
> >> >>   ...
> >> >> 
> >> >>    now, expose UICommand that triggers your dialog like this:
> >> >> 
> >> >>   public UICommand getTemplateBackupCommand() {
> >> >>     return privateTemplateBackupCommand;
> >> >>   }
> >> >> 
> >> >>   private void setTemplateBackupCommand(UICommand value) {
> >> >>     privateExportCommand = value;
> >> >>   }
> >> >> 
> >> >>   // inside TemplateListModel constructor
> >> >>   ...
> >> >>   setTemplateBackupCommand(new UICommand("TemplateBackup", this));
> >> >>   //$NON-NLS-1$
> >> >>   ...
> >> >> 
> >> >>   // inside TemplateListModel#executeCommand
> >> >>   ...
> >> >>   else if (command == getTemplateBackupCommand()) {
> >> >>     backup();
> >> >>   }
> >> >>   ...
> >> >> 
> >> >> 3, tell UI (GWTP) infra how to handle your dialog model - in this
> >> >>    particular case, edit TemplateModule#getTemplateListProvider:
> >> >> 
> >> >>   ...
> >> >>   if (lastExecutedCommand == model.getEditCommand()) {
> >> >>     return popupProvider.get();
> >> >>   } else if (lastExecutedCommand == getModel().getExportCommand()) {
> >> >>     return exportPopupProvider.get();
> >> >>   } else if (lastExecutedCommand ==
> >> >>getModel().getTemplateBackupCommand()) {
> >> >>     return templateBackupProvider.get();
> >> >>   } else {
> >> >>     return super.getModelPopup(source, lastExecutedCommand,
> >> >>windowModel);
> >> >>   }
> >> >>   ...
> >> >> 
> >> >>    now, add parameter to TemplateModule#getTemplateListProvider:
> >> >> 
> >> >>   @Provides
> >> >>   @Singleton
> >> >>   public MainModelProvider<VmTemplate, TemplateListModel>
> >> >>   getTemplateListProvider(
> >> >>     ...
> >> >>     final Provider<TemplateBackupPopupPresenterWidget>
> >> >>     templateBackupPopupProvider) {
> >> >>   ...
> >> >> 
> >> >> 4, create PresenterWidget & View for your dialog, this is the visual
> >> >>    part of the dialog (dialog model just encapsulates the dialog
> >>logic)
> >> >> 
> >> >>   public class TemplateBackupPopupPresenterWidget extends
> >> >>   AbstractModelBoundPopupPresenterWidget<TemplateBackupModel,
> >> >>   TemplateBackupPopupPresenterWidget.ViewDef> {
> >> >> 
> >> >>     public interface ViewDef extends
> >> >>     
> >>AbstractModelBoundPopupPresenterWidget.ViewDef<TemplateBackupModel>
> >> >>{
> >> >>     }
> >> >> 
> >> >>     @Inject
> >> >>     public TemplateBackupPopupPresenterWidget(EventBus eventBus,
> >>ViewDef
> >> >>     view) {
> >> >>       super(eventBus, view);
> >> >>     }
> >> >> 
> >> >>   }
> >> >> 
> >> >>   ---
> >> >> 
> >> >>   public class TemplateBackupPopupView extends
> >> >>   AbstractModelBoundPopupView<TemplateBackupModel> implements
> >> >>   TemplateBackupPopupPresenterWidget.ViewDef {
> >> >> 
> >> >>     // you can get some inspiration from VmExportPopupView
> >> >> 
> >> >>   }
> >> >> 
> >> >> 5, you are done :)
> >> >> 
> >> >> Vojtech
> >> >> 
> >> >> 
> >> >> ----- Original Message -----
> >> >> > From: "力波 王" <wlbleaboy at 126.com>
> >> >> > To: devel at ovirt.org
> >> >> > Sent: Tuesday, August 12, 2014 7:57:24 AM
> >> >> > Subject: [ovirt-devel] popup dialog
> >> >> > 
> >> >> > Hi, everyone:
> >> >> > I add a button, named backup in the Template Tab,
> >> >> > And the click event is ok.
> >> >> > Now I want add a dialog after clicked the button,
> >> >> > So, I add a model , but the dialog didn’t display at all.
> >> >> > 
> >> >> > So, I want to know is there some necessary class need
> >> >> > To modify or add?
> >> >> > 
> >> >> > The model code is like this:
> >> >> > TemplateBackupModel.java
> >> >> > ========================================================
> >> >> > public class TemplateBackupModel extends Model {
> >> >> > 
> >> >> > private EntityModel privatePassword;
> >> >> > 
> >> >> > public EntityModel getPassword()
> >> >> > {
> >> >> > return privatePassword;
> >> >> > }
> >> >> > 
> >> >> > public void setPassword(EntityModel value)
> >> >> > {
> >> >> > privatePassword = value;
> >> >> > }
> >> >> > 
> >> >> > public TemplateBackupModel(){
> >> >> > 
> >> >> > setPassword(new EntityModel());
> >> >> > 
> >> >> > AsyncQuery _asyncQuery = new AsyncQuery();
> >> >> > _asyncQuery.setModel(this);
> >> >> > _asyncQuery.asyncCallback = new INewAsyncCallback() {
> >> >> > @Override
> >> >> > public void onSuccess(Object model, Object result)
> >> >> > {
> >> >> > 
> >> >> > }
> >> >> > };
> >> >> > 
> >> >> > }
> >> >> > 
> >> >> > @Override
> >> >> > public void eventRaised(Event ev, Object sender, EventArgs args) {
> >> >> > super.eventRaised(ev, sender, args);
> >> >> > }
> >> >> > 
> >> >> > public boolean validate(){
> >> >> > return true;
> >> >> > }
> >> >> > }
> >> >> > ========================================================
> >> >> > 
> >> >> > And created a model in the backup button click callback like this:
> >> >> > ========================================================
> >> >> > public void backup()
> >> >> > {
> >> >> > 
> >> >> > if (getWindow() != null)
> >> >> > {
> >> >> > return;
> >> >> > }
> >> >> > 
> >> >> > TemplateBackupModel model = new TemplateBackupModel();
> >> >> > setWindow(model);
> >> >> > model.setTitle("TemplateBackup");//$NON-NLS-1$
> >> >> > model.setHashName("TemplateBackup");//$NON-NLS-1$
> >> >> > 
> >> >> > 
> >> >> > UICommand tempVar = new UICommand("OnBackup", this); //$NON-NLS-1$
> >> >> > 
> >>tempVar.setTitle(ConstantsManager.getInstance().getConstants().ok());
> >> >> > tempVar.setIsDefault(true);
> >> >> > model.getCommands().add(tempVar);
> >> >> > UICommand tempVar2 = new UICommand("Cancel", this); //$NON-NLS-1$
> >> >> > 
> >> 
> >>>>tempVar2.setTitle(ConstantsManager.getInstance().getConstants().cancel(
> >>>>))
> >> >>;
> >> >> > tempVar2.setIsCancel(true);
> >> >> > model.getCommands().add(tempVar2);
> >> >> > 
> >> >> > }
> >> >> > ========================================================
> >> >> > 
> >> >> > _______________________________________________
> >> >> > Devel mailing list
> >> >> > Devel at ovirt.org
> >> >> > http://lists.ovirt.org/mailman/listinfo/devel
> >> >> _______________________________________________
> >> >> Devel mailing list
> >> >> Devel at ovirt.org
> >> >> http://lists.ovirt.org/mailman/listinfo/devel
> >> 
> >> 
> >> 
> >> 
> 
> 
> 
> 



More information about the Devel mailing list