I have an application that has many windows, which can be handled by corresponding buttons on a toolbar (sounds familiar right?!)
I currently have it so that if you click a button on the toolbar, if it is not ontop bring it to the front (toFront), if it is minimised, maximise it etc.
I want to be able to detect whether the window is the front most window...
Cheers
EDIT
TO further describe the situation: say if I have a window that is at the front, or "active". Then I click the corresponding toolbar button which minimises that window. I want to then find which window becomes "active".
To manage your Ext.Window instances use the Ext.WindowMgr singleton:
http://dev.sencha.com/deploy/dev/docs/?class=Ext.WindowMgr
In a button's handler:
// Assuming 'winID' has been populated with the ID of an
// Ext.Window instance associated with the button.
win = Ext.WindowMgr.get(winID);
win.show();
Ext.WindowMgr.bringToFront(win);
win.maximize();
Why not set an activeWindow property as part of the handler for clicking a button on the toolbar? If the window associated with that button is already at the front, there's nothing left to do.
Related
I am currently trying to make a more accessible version of an info window by extending google map's overlay view class (by building on this example). In my web app, when the user clicks on a marker or on an item in a list of locations displayed in a sidebar, an info window will open up at the position of the corresponding marker and display supplementary information about the selected location, which may include a description, images, ratings, tips, etc. retrieved from another API. There will only ever be a maximum of one info window open at any given time.
What I'm confused about is which semantic element or role attribute or whatnot to use to describe the info window and thus how to manage focus accordingly? My current thoughts are:
use the role = 'dialog' attribute and develop the info window as a non-modal type dialog so that external content outside the info window is still accessible. In this case, the marker and list items can have the attribute aria-haspopup = 'dialog' which would nicely alert of the opening of the info window. The problem with this approach is that it is disruptive by nature and it's not exactly critical information being displayed in the info window nor is it information in which the user needs to respond to it.
use an <aside> element since it contains information complementary to the marker or side bar list item clicked upon. The info window will have a title of the location clicked on, so the info window could be viewed as stand alone information. However, I can't use the aria-haspopup attribute in this case. I suppose I could label the marker and list item buttons in such a way as to alert the user that an info window will open up as a result by using aria-label.
use role = 'tooltip' and describe the info window as a tooltip widget. But this implies that focus has to be trapped within the info window until it is closed. In google map's actual implementation of the info window, a user can interact with anything else on the page without focusing the info window to close and I don't think it makes sense to change that default behavior. There's also arguments about whether a tooltip can be triggered outside of a mouseover/hover event and I want the info window to appear on a click event or enter/space key events.
implement the info window as 'collapsible content' and the associated marker and list item buttons as 'disclosure' buttons. This way the user is alerted of extra content appearing in a non-disruptive manner and focus isn't trapped within the info window. Although the styling wouldn't follow the typical styling practices/DOM order of collapsible content since the info window's html wouldn't appear immediately after the html of the button that triggered the info window opening.
Which option(s) is appropriate, or is there a better approach that makes more sense?
Depending on which approach is chosen, should focus be trapped within the info window?
If the info window is closed and the focused wasn't trapped within the info window, where should focus go after closing it using a click event or keyboard shortcut:
The button that opened the info window?
The last focused element before closing the info window (provided the last focused element was outside the info window)? But what if the last focused element was an element within the info window?
The body element or map element?
Also, should focus move immediately into the info window when it is opened or should it remain on the button that triggered it's opening?
First of all I need to determine which window or tab is actually opened in browser at the moment. I need it's name or create it by specifying unique value which I'm able to find for each one of them.
Then I need to switch between these tabs and windows. Are there any commands to do so?
I Need to copy some string value.
Need to change tab.
Click a button.
New window appears.
Click a button.
Paste this text.
Click a button.
Close this window.
Get back to 1st tab I was on.
Those are steps I want to automate.
Thank you in advance for any help!
While creating Sencha touch application where I am using List View with HTML buttons. While clicking on button I am adding a pop up window on Viewport.But problem is whenever I am clicking on View except area covered by pop panel,pop up gets hide rather than getting destroyed.
and after clicking on html button for other itemlist, it creates 2 pop up view and gets hanged because of same itemId for pop up.
How to destory the multiple pop up panel on viewport.
Sorry,I can't share the code.
Define your window with
modal : true,
Like this it is not possible to click outside the window. It will always stay on top.
By default, the window is destroyed when it is closed. So either you do not close the window, or you have overridden the closeAction or autoDestroy config.
I am rendering a html page that contains a button.
I have bind a method to browser window that opens a gwt popup when the button is invoked.
My problem is, when i scroll the page, the popup stays fixed and the page scrolls. I want the popup to be scrolled along with the html page.
Also, the user should not be allowed to access other parts of app when the popup is open.
Can somebody help me
Assuming you are using the PopupPanel class, it is as easy as calling the right constructor:
PopupPanel(boolean autoHide, boolean modal)
autoHide - true if the popup should be automatically hidden when the user clicks outside of it or the history token changes.
modal - true if keyboard or mouse events that do not target the PopupPanel or its children should be ignored
So if you set the modal parameter, you cannot click outside of the popup, and also the scroll event should not happen at all (that is somewhat right, as scrolling a popup with a fixed positioning doesn't make much sense... Oh well, for a non advertising purpose at least).
I'm having an issue with a our main application's window activating itself when the mouse is hovered over it.
I'm opening the new window in a javascript function using the line below:
window.open(URL, 'Requests', 'location=no,toolbar=no,status=yes,scrollbars=yes,resizable=yes');
I have noticed that if I open a new IE window through Explorer, hovering over our main application's window does not reactivate itself. Even in this case though, the main window does make itself be "on top" of the pop-up window created by the window.open command above.
The question is this: Is there any way, when opening a "child" window in javascript, to detach the child window from the parent?
Further info: I am using an Infragistics WebDataMenu with ActivateOnHover set to true so users don't need to click on main menu items to see sub-menu choices. Unfortunately, that setting sensitizes the whole menu bar so that sliding the mouse through it activates the menu (and sadly the window when a popup is active). This is the root behavior I'm trying to fix.
The window.open(); method will create a popup window that really only shares a relationship through JavaScript via the return value of the call, and the window.opener property on the popup window.
What you want is the behavior of a modal window that locks out interaction from the 'parent' page while you work on the 'child' popup.
You can try to fight with JavaScript (and your users) by forcing a focus on the popup and blocking any blurring but this will drive users nuts when they want to go read their email etc. (eg not recommended)
You can also use the not so standard showModalDialog(); method but support is far from fully cross browser and there are a whole bunch of new problems if you try to use this (no right click in IE, zoom issues in IE, and no grandchildren popups to name a few) (again not recommended)
What you can do is make an "overlay" popup similar to many online photo viewers where you first overlay a mask (typically semi transparent) that blocks mouse/focus on the entire page content below and then overlay that with your "popup content". Just be sure that you provide a close option that removes the mask when the overlay is closed/done.
Note if you need to support IE6 you'll also need an iframe shim (Google if needed)
Many UI frameworks will provide a "dialog" just like this for you. (Eg jQueryUI)
Ultimately, I gave up on making this work. I found that what I had to do was turn off ActivateOnHover from the WebDataMenu, which didn't answer this question and requires users to click on the menu to make it drop down, but it became a work-around.