Clearing history token ver html or native javascript without reloading page?

[darkflame]

I tried googleing for this without much success, despite the fact its
really more a javascript rather then GWT query, I couldnt find
anywhere else with an answer.

Basicaly I have a gwt application which triggers a pop-up window,
which is an extension of DialogBox.

Because I wanted a windows like "X" in the corner to close it, I
followed some advice and altered the titlebar of it with;

this.setHTML("<div class=\"captiontext\"> - Title Here - </div><div
onclick=\"closeDialog()\" class=\"closeimage\" >&nbsp&nbsp&nbsp</
div>");

redefineClose(QuickReviewPopUp);

..

private native void redefineClose(DialogBox dialogBox) /*-{
$wnd['closeDialog'] = function () {
dialogBox.@com.google.gwt.user.client.ui.DialogBox::hide()();
}
}-*/;


This works, the dialogue close's nicely. When the x is hit.

However, as I'm not using a normal link to close it, I have no idea
how to clear the history token.
The historytoken is changed when the popup appears as I want the state
of if its open/close to be saved, but I cant work out how to set it
back when it closes.
Is there a javascript function I could put in the refdefineClose that
would do this?

I tried using (<a href="#"></a>) around the divs in the link that
triggers the native javascript, but aside from looking messy,all this
reloads the page.
(at least in IE, but the normal internal hyperlinks triggering the
popups dont reload the page in IE, so clearly there must be some
difference)

[Darkflame]

Just to clarify my attempted solution and why it isnt working;

<a href="#PostNewReview"> Post Quick Review </a>

Is the html produced by one of the standard Hyperlinks in GWT. This
works fine, it triggers history, and it dosnt refresh the page in IE.

This however, is the html produced by my attempt at having a close "X"
in the corner of the dialogue box clear the history token;

<a href="#">
<div class="closeimage" onclick="closeDialog()"/>
</a>

This, annoyingly, cause's the page to refresh in IE.

Why :?

On Apr 10, 12:02 pm, darkflame <darkfl...@gmail.com> wrote:
> I tried googleing for this without much success, despite the fact its
> really more a javascript rather then GWT query, I couldnt find
> anywhere else with an answer.
>
> Basicaly I have a gwt application which triggers a pop-up window,
> which is an extension of DialogBox.
>
> Because I wanted a windows like "X" in the corner to close it, I
> followed some advice and altered the titlebar of it with;
>
>  this.setHTML("<div class=\"captiontext\"> - Title Here - </div><div
> onclick=\"closeDialog()\" class=\"closeimage\" >&nbsp&nbsp&nbsp</
> div>");
>
> redefineClose(QuickReviewPopUp);
>
> ..
>
> private native void redefineClose(DialogBox dialogBox) /*-{
>            $wnd['closeDialog'] = function () {

>            dialogB...@com.google.gwt.user.client.ui.DialogBox::hide()();

[Vitali Lovich]

Just a quick question.  For such basic stuff, why are you using JSNI at all?  Just extend the widget to do what you want (or copy, paste & hack the code from gwt).

This all seems to be something that is perfectly fine to be within the scope of regular code.

[Darkflame]

It cant be extended as theres no method to alter the caption bar.
I could copy, paste and hack it, but really I didnt want to have to
mess about on that level.
So instead I was following the advice here;
http://groups.google.com/group/Google-Web-Toolkit/browse_thread/thread/2950c44985a26cdf/ad1a99c7b907c1f3?lnk=gst&q=DialogBox+close#ad1a99c7b907c1f3

[Vitali Lovich]

Check out gwt-mosaic.  It has dialog panels with close buttons.

[Darkflame]

yes, mosaic is quite good, but for this project I'm trying to keep the
size of the extra libs used down to a minimum.
Also, by extending/altering the normal popup, it makes it easier for
me to use and modify the standard gwt style themes.

On 11 apr, 15:35, Vitali Lovich <vlov...@gmail.com> wrote:
> Check out gwt-mosaic.  It has dialog panels with close buttons.
>
>
>
> On Sat, Apr 11, 2009 at 9:19 AM, Darkflame <darkfl...@gmail.com> wrote:
>
> > It cant be extended as theres no method to alter the caption bar.
> > I could copy, paste and hack it, but really I didnt want to have to
> > mess about on that level.
> > So instead I was following the advice here;
>

> >http://groups.google.com/group/Google-Web-Toolkit/browse_thread/threa...

[Darkflame]

Still having trouble with this.

Anyone got any ideas?

Either what html is needed to make a bookmark that dosnt refresh IE,
or native javascript that would clear the history token. (or well, set
it to anything).

[Salvador Diaz]

* Create a class that extends DialogBox
* In your constructor, hack away the caption through DOM calls
* Create the widget that you want to add to the caption (it must
implement SourcesMouseEvents if you want to be able to drag the
dialog)
* Attach your new widget to the dialog through DOM calls (just like
the caption gets attached to the dialog box):

// Add the caption to the top row of the decorator panel. We need
to
// logically adopt the caption so we can catch mouse events.
Element td = getCellElement(0, 1);
DOM.appendChild(td, caption.getElement());
adopt(caption);
caption.setStyleName("Caption");
caption.addMouseListener(this);

More often than not, just looking at the source code for GWT standard
widgets will tell you how to do things that are not avaliable in
standard GWT widgets.

I hope it helps.

Cheers,

Salvador

[Darkflame]

Thanks for your help :)
It would be nice to get back to a gwt solution, rather then having
mess bits of native.

My widget already extends DialogBox;
Replaceing my;

this.setHTML("<div class=\"captiontext\"> - Post a new review - </
div><a href=\"#\"><div onclick=\"closeDialog()\" class=\"closeimage
\"></div></a>");

line with;

Element td = getCellElement(0, 1);
DOM.appendChild(td, caption.getElement());
adopt(caption);
caption.setStyleName("Caption");
caption.addMouseListener(this);

However, results in a message telling my caption is not
visible...presumably because its Private in the DialogBox class?

I have been looking inside the gwt dialog widget while playinga bout
this whole time, but I'm just not good enough to work out precisely
what I need to do from that.

To be honest, I'm not even sure if I could add a widget to the panel
without resulting to native html+javascript it would solve my core
problem;
How would you have an image file being clicked change a history token?
Would Image need to be extended with dom calls to do that?

[Salvador Diaz]

> Thanks for your help :)

You're welcome

> It would be nice to get back to a gwt solution, rather then having
> mess bits of native.

Well, DOM is a GWT class, so I consider my solution to be pure GWT :)
Plus the widget handling the History change will be also pure GWT

> My widget already extends DialogBox;
> Replaceing my;
>
> this.setHTML("<div class=\"captiontext\"> - Post a new review - </
> div><a href=\"#\"><div onclick=\"closeDialog()\" class=\"closeimage
> \"></div></a>");
>
> line with;
>
>   Element td = getCellElement(0, 1);
>     DOM.appendChild(td, caption.getElement());
>     adopt(caption);
>     caption.setStyleName("Caption");
>     caption.addMouseListener(this);
>
> However, results in a message telling my caption is not
> visible...presumably because its Private in the DialogBox class?

I was just showing you how the caption is originally attached to the
DialogBox, not telling you to replace your code with that, precisely
because caption is private and you can't refer to it. As my second
step suggested, you have to hack away the original caption with DOM
calls. Here's the code that will remove the caption (GWT 1.5.3):

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.DialogBox;
import com.google.gwt.user.client.ui.Label;

public class CaptionRemover implements EntryPoint {
public void onModuleLoad() {
DialogBox box = new DialogBox();
box.setText("caption");
box.setWidget(new Label("contents"));
box.center();
Element dialogTopCenter = (Element) box.getElement
().getElementsByTagName("table").getItem(0).getElementsByTagName
("tr").getItem(0).getElementsByTagName("td").getItem(1);
Element captionElement = (Element)
dialogTopCenter.getFirstChildElement().getFirstChildElement();
GWT.log(dialogTopCenter.getString(), null);
GWT.log(captionElement.getString(), null);
DOM.removeChild((Element) captionElement.getParentElement(),
captionElement);

}
}


> To be honest, I'm not even sure if I could add a widget to the panel
> without resulting to native html+javascript it would solve my core
> problem;

I'm sure it would. Now that you have removed the caption you can
create an Image that adds a HistoryToken onClick and add it with DOM
calls inside the extended class

Image image = new Image("url");
image.addClickListener(//call the History.addToken here);

Element td = getCellElement(0, 1);

DOM.appendChild(td, image.getElement());

adopt(caption);
caption.setStyleName("Caption");
caption.addMouseListener(this);

Voilà ! It should work or at least give you enough inspiration to make
it work. Frankly, I don't think I can be more specific without coming
to your workplace and coding it for you.

Cheers,

Salvador

[Darkflame]

Thanks again so much for your help

> Well, DOM is a GWT class, so I consider my solution to be pure GWT :)
> Plus the widget handling the History change will be also pure GWT

Oh, I understood that, I was infering your solution was much better
then what I had already.

Anyway, I think I'm 90% there now, I might just need a little more
nudge in the right direction next time you got a mo.
I have replaced the caption, and its dragable, and it even has an
image in it now...looking pretty like my old caption, but now 100%
gwt.

However, the onClick of the image isnt fireing. I suspect this is
because the whole caption panel area is hogging all the click events.
This is despite my addClickListener being only added to the label as
so;

HorizontalPanel newCaptionBar = new HorizontalPanel();
Label newCaptionLabel = new Label(" - blah - ");
Image closeImage = new Image("close.png");

closeImage.addClickHandler(new ClickHandler(){
public void onClick(ClickEvent event) {
//this dosnt fire
ThisDia.hide();
History.newItem("");
}
});

newCaptionBar.add(newCaptionLabel);
newCaptionBar.add(closeImage);

Element td = getCellElement(0, 1);

DOM.appendChild(td, newCaptionBar.getElement());
adopt(newCaptionBar);
newCaptionBar.setStyleName("caption");
newCaptionLabel.addMouseListener(this);


As an expirement I tried disableing the addMouseListener line, with
no effect. (the whole dialogue is still dragable ver the caption area.
It seeems I'm thus not removing the original dragability when the
(widgets standard) caption area is removed by your

DOM.removeChild((Element)captionElement.getParentElement
(),captionElement);

line.
Is the dragability set to the parent of the caption?

Or maybe the error is because I am using 1.6, which now use's
handelers rather then listeners? (allthough they should still work)
I tried swapping addMouseListener for addMouseMoveHandler anyway with
no success...DialogBox dosnt impliment MouseHandlers itself, and
Caption interface which does is private. (so I left it as a
MouseListener for now).

>
> Voilà ! It should work or at least give you enough inspiration to make
> it work. Frankly, I don't think I can be more specific without coming
> to your workplace and coding it for you.

Ok my address is 64 b.... ;)

No, I think I can get there now with enough expirements, just some
teathing trouble now rather then "completely havnt a clue where to
start"