il modo migliore per esternare l’HTML nelle app GWT?

Qual è il modo migliore per esternare grandi quantità di HTML in un’app GWT? Abbiamo un’app GWT piuttosto complicata di circa 30 “pagine”; ogni pagina ha una sorta di guida in fondo che è diversi paragrafi di markup HTML. Mi piacerebbe esternare l’HTML in modo che possa rimanere il più “senza caratteri” ansible.

Conosco e capisco come usare i file di proprietà in GWT; è sicuramente meglio che incorporare il contenuto nelle classi Java, ma è ancora un po ‘brutto per l’HTML (è necessario backslashify di tutto, così come le virgolette di escape, ecc.)

Normalmente questo è il tipo di cosa che inseriresti in un JSP , ma non vedo alcun equivalente a quello in GWT. Sto prendendo in considerazione solo la scrittura di un widget che recupera semplicemente il contenuto dai file html sul server e quindi aggiunge il testo a un widget HTML. Ma sembra che ci dovrebbe essere un modo più semplice.

Puoi usare un meccanismo di template. Prova i modelli di FreeMarker o Velocity . Avrai il tuo codice HTML nei file che verranno recuperati dalle librerie dei modelli. Questi file possono essere nominati con estensioni appropriate, ad esempio .html, .css, .js possono essere avvistati da soli.

Ho usato ClientBundle in un’impostazione simile. Ho creato un pacchetto my.resources e ho inserito il mio documento HTML e la seguente class:

package my.resources; import com.google.gwt.core.client.GWT; import com.google.gwt.resources.client.ClientBundle; import com.google.gwt.resources.client.TextResource; public interface MyHtmlResources extends ClientBundle { public static final MyHtmlResources INSTANCE = GWT.create(MyHtmlResources.class); @Source("intro.html") public TextResource getIntroHtml(); } 

Quindi ottengo il contenuto di tale file richiamando quanto segue dal mio codice cliente GWT:

 HTML htmlPanel = new HTML(); String html = MyHtmlResources.INSTANCE.getIntroHtml().getText(); htmlPanel.setHTML(html); 

Vedi http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html per ulteriori informazioni.

Direi che carichi l’html esterno attraverso un Frame .

 Frame frame = new Frame(); frame.setUrl(GWT.getModuleBase() + getCurrentPageHelp()); add(frame); 

È ansible organizzare alcune convenzioni o cercare getCurrentPageHelp ( ) per restituire il percorso appropriato (ad es .: /manuals/myPage/help.html )

Ecco un esempio di frame in action.

In GWT 2.0, puoi farlo utilizzando UiBinder .

  
Hello, , this is just good 'ol HTML.

Questi file sono tenuti separati dal codice Java e possono essere modificati come HTML. Offrono anche l’integrazione con i widget GWT, in modo da poter accedere facilmente agli elementi contenuti nel codice HTML dal tuo codice GWT.

GWT 2.0, una volta rilasciato, dovrebbe avere un ClientBundle, che probabilmente affronta questa necessità.

Potresti provare a implementare un Generator per caricare HTML esterno da un file in fase di compilazione e creare una class che lo emetta. Non sembra esserci troppo aiuto online per la creazione di generatori, ma ecco un post per il gruppo GWT che potrebbe aiutarti: gruppo GWT su groups.google.com .

Stavo facendo ricerche simili e, finora, vedo che il modo migliore per affrontare questo problema è attraverso il DeclarativeUI o UriBind . Purtroppo è ancora in incubatore, quindi dobbiamo risolvere il problema.

Lo risolvo in un paio di modi diversi:

  1. Sovrapposizione triggers, ovvero: crei il tuo standard HTML / CSS e inietti il ​​codice GET tramite il tag . Ovunque sia necessario accedere a un elemento dal codice GWT, scrivi qualcosa come questo:

     RootPanel.get("element-name").setVisible(false); 
  2. Scrivi il tuo codice 100% GWT e poi, se è necessario un grosso chunk HTML, lo porti al client tramite IFRAME o tramite AJAX e poi lo inietti tramite il pannello HTML in questo modo:

     String html = "
    " + "
    "; HTMLPanel panel = new HTMLPanel(html); panel.setSize("200px", "120px"); panel.addStyleName("demo-panel"); panel.add(new Button("Do Nothing"), "one"); panel.add(new TextBox(), "two"); RootPanel.get("demo").add(panel);

Perché non usare il buon vecchio IFRAME? Basta creare un iFrame in cui si desidera inserire un suggerimento e modificare la sua posizione quando cambia la “pagina” GWT.

vantaggi:

  • Gli hit sono memorizzati in file HTML manutenibili separati di qualsiasi struttura
  • Caricamento in stile AJAX senza alcuna codifica sul lato server
  • Se necessario, l’applicazione potrebbe comunque interagire con le informazioni caricate

svantaggi:

  • Ogni file di suggerimento dovrebbe avere un collegamento ai CSS condivisi per un aspetto comune
  • Difficile da internazionalizzare

Per rendere questo approccio un po ‘migliore, è ansible gestire gli errori di caricamento e il reindirizzamento alla lingua / argomento predefinito su 404 errori. Quindi, la priorità di ricerca sarà così:

  1. Argomento attuale per la lingua corrente
  2. Argomento corrente per la lingua predefinita
  3. Argomento predefinito per la lingua corrente
  4. Pagina di errore predefinita

Penso che sia abbastanza facile creare tale componente GWT per incorporare interazioni iFrame

Il framework GWT Portlets ( http://code.google.com/p/gwtportlets/ ) include un WebAppContentPortlet. Questo serve qualsiasi contenuto dalla tua app web (HTML statico, JSP ecc.). Puoi metterlo su una pagina con funzionalità aggiuntive in altri Portlet e tutto viene recuperato con una singola chiamata asincrona quando la pagina viene caricata.

Dai un’occhiata all’origine di WebAppContentPortlet e WebAppContentDataProvider per vedere come è fatto o provare a utilizzare il framework stesso. Ecco i bit di origine rilevanti:

WebAppContentPortlet (lato client)

 ((HasHTML)getWidget()).setHTML(html == null ? "Web App Content" : html); 

WebAppContentDataProvider (lato server):

 HttpServletRequest servletRequest = req.getServletRequest(); String path = f.path.startsWith("/") ? f.path : "/" + f.path; RequestDispatcher rd = servletRequest.getRequestDispatcher(path); BufferedResponse res = new BufferedResponse(req.getServletResponse()); try { rd.include(servletRequest, res); res.getWriter().flush(); f.html = new String(res.toByteArray(), res.getCharacterEncoding()); } catch (Exception e) { log.error("Error including '" + path + "': " + e, e); f.html = "Error including '" + path + "'
(see server log for details)"; }

Puoi usare servlet con jsps per le parti html della pagina e includere ancora il javascript necessario per eseguire l’app gwt sulla pagina.

Non sono sicuro di aver capito la tua domanda, ma assumerò che tu abbia scomposto questo sumrio comune nel suo stesso widget. Se è così, il problema è che non ti piace il modo brutto di incorporare l’HTML nel codice Java.

GWT 2.0 include UiBinder , che consente di definire la GUI in template HTMLish raw e di inserire valori nel modello dal mondo Java. Leggi la guida dello sviluppo e dà una buona idea.

Puoi provare l’ app GWT con i modelli html generati e associati in fase di esecuzione, senza tempo di compilazione.

Non conoscendo GWT, ma non puoi definire e ancorare il tag div nella tua app html, quindi eseguire un get contro i file HTML di cui hai bisogno e aggiungerlo al div? Quanto sarebbe diverso da un micro-modello ?

AGGIORNARE:

Ho appena trovato questo bel plugin jQuery in una risposta a un’altra domanda StackOverflow .