Intégration d'une boîte de dialogue GWT dans une application HTML existante

Question

J'ai une situation dans laquelle j'ai besoin d'intégrer une boîte de dialogue gwt (qui, au mieux, est implémentée comme div avec manipulation d'index z) dans une page html existante.
Il y a deux scénarios:
1. Quel est préférable et plus compliqué est où je donne à la page html hôte une autre page qu'ils intègrent comme un iframe et je travaille ma magie à travers là (peut-être se connecter en quelque sorte à la fenêtre parent et planter mon dialogue, je ne suis pas sûr).
2. Où j'ai un accès limité à la page html et je plante du code là qui va charger ma boîte de dialogue.

Des idées ou des réflexions sur la façon dont je peux les mettre en œuvre?
Je travaille depuis quelques mois avec GWT et je l'ai trouvé plutôt sympa même si je suis resté loin de toute la zone HTML et jusqu'à présent tout mon travail a été fait strictement dans mes classes java.
Merci pour toutes les idées et l'aide remise
Itthaï

Answer 1

Je suppose que vous voulez dire par une boîte de dialogue des pop-up qui est invisible à la page charge et rendue visible par, par exemple, un clic sur quelque chose dans le code HTML existant. Une stratégie simple pour y arriver consiste à envelopper le code HTML existant.

Je n'ai aucune expérience avec l'option 1. Comme pour 2, tout ce que vous devez modifier dans le HTML existant est en ajoutant l'importation JS, par exemple. Puis

<script type="text/javascript" language="javascript" src="/com.your.org.Module/com.your.org.module.client.Module.nocache.js"></script> 

puis d'ajouter un identifiant à un élément cliquable que vous souhaitez activer votre boîte de dialogue, par ex.

<button id="launchDialog">Show Dialog</button> 

et enfin ajouter un div vide avec un identifiant pour insérer votre dialogue dans le DOM.

<div id="dialog"></div> 

Ensuite, tout ce dont vous avez besoin dans votre module est

public class Module implements EntryPoint { 

    @Override 
    public void onModuleLoad() { 
     Button b = Button.wrap(DOM.getElementById("launchDialog")); 
     b.addClickHandler(new ClickHandler() { 
      public void onClick(ClickEvent event) { 
       RootPanel panel = RootPanel.get("dialog"); 
       Widget w = ... // your dialog widget here 
       panel.add(w); 
      } 
     }); 
    } 

} 

Enfin, vous pouvez jouer avec la visibilité de votre div pop-up avec le « display: none » le style et le spectacle() et se cacher () des méthodes sur le widget.