Windows 7 gadget flyout window question

Question

I created a gadget that displays the feed from a website and displays it in the main window. If I click on one of the news I get the flyout window and it gives me more information. I also have a search option in the main body, that does the search on the site but it opens in the browser window.

My question is how can I make the search function open in the flyout window? Is there a way to link the search button to a flyout_2 file? Maybe someone can point me in the right direction.

Answer 1

Flyout windows must be opened manually.

The entire interface is soup. A flyout must also be pointed to a valid HTML page (locally or remotely, it doesn't matter). Once loaded, however, you can treat the DOM however you like.

That being said, capture the "search" event and make it display to the flyout DOM. This could be with a redirect of the flyout itself, an iframe with a dynamically set target, or other DOM manipulation.

One trick I have used is to use a "generic" flyout which simply invokes a method on the parent window passing in itself as a parameter (flyouts are are just child windows) and then let the "main" gadget actually handle the DOM work based on context.

// in "fuout.html"
jQuery(function ($j) {
    var parent = System.Gadget.document
    parent.loadFuout(document, $j)
})

// in main gadget html
document.loadFuout = function (fuout, _j) {
    // other stuff based on current flyout context...
    // fuout is document object of flyout
}

Please note: in my case I run a slightly modified jQuery in which document is bound in a closure. This allows me to refer to the "correct jQuery object for the document", above that is accessed via _j.