Is it possible to bind/setup/init featherlight without also opening the modal?
Currently var modal = $.featherlight($target,config) binds and then opens.
I have worked around it for now by immediately invoking modal.close() but this feels hacky.
Possible options:
1) New config option openOnBind (true/false)
2) Bind should not open by default - user can choose to use .open() afterwards as needed.
I have also tried var modal = $target.featherlight(config) but
both $target.open() and modal.open() then fail - neither contain the featherlight object/instance.
Where is the featherlight instance hiding? :)
Fiddled:
http://jsfiddle.net/eybb104r/2/
P.S. The context for this is launching a modal based on the presence of a cookie, so I need to bind a modal without a DOM element trigger.
It's really unclear why you want to do this, as there aren't any useful methods to call on a closed featherlight.
It's not documented (nor really supported), but you can do:
var fl = new $.Featherlight($content, config);
// Do something here, really unclear what though
fl.open();
Related
At the moment I am using the bootstrap-ui modal and it give me the possibility to create an own controller for each modal where I can assing some values from the current form and when I close the modal with the "OK" button an callback function is called, where I can get also some values I've selected in the Modal before when I assing them to the callback function.
And its also possible to open the modal with $q and return the modal as promise.
Are these options also possible with the angular-strap modals? I can't find something about this in the documentation.
I found the AngularStrap documentation (if they want to call it that) quite lacking. You've really either gotta check the source, or find an example elsewhere for many common issues.
Yes, the $modal object can accept promises, but I haven't touched that in a while. I'm a little knowledgeable about Bootstrap-UI's modal implementation and found that it was more robust, so I can't say for certain that you'll find what you need in AS'.
Is there a property that tells if a form is deactivated by other form ShowModal procedure ?
EDIT :
My program has a tray icon that brings to front the main form when it's clicked. I want to disable this when another window is shown in modal state. Because not doing so the main form (which is disable) will cover the modal form and completly block my program.
This behaviour is to be expected. When a modal form is shown, the other forms are disabled. You don't need to disable anything at all, the framework already handles it all for you. The beep is sounding because you are attempting to interact with a disabled form.
If you want to be notified when your window has been disabled, for any reason, not just because a modal form has been shown, listen to the WM_ENABLE message. To test whether or not your main form has been disabled. Do that by calling the IsWindowEnabled Win32 function.
Having said that I feel that it is likely you've not diagnosed the issue correctly. It sounds like you might be suffering from window ownership problems, which are common in Delphi 6. Or perhaps you are attempting to restore the application incorrectly from your notification icon code. Use Application.BringToFront for that.
The VCL's handling of modal dialogs seem very mixed up. When you show a system provided modal dialog, e.g. MessageBox, windows are disabled whether or not they are visible. However, the VCL only disables visible windows when ShowModal is called. What's more, you cannot use Enabled to test whether or not the window is disabled, you must use the IsWindowEnabled Win32 function.
You can test Application.ModalLevel at any point in time to find out if there's a modal form. E.g.:
if Application.ModalLevel = 0 then
MainForm.Visible := True;
Note that non-TCustomForm descendants will not set modal level, API dialogs like a file open dialog or MessageBox for instance. If there's a possibility of such a thing, you might surround code that runs those dialogs with ModalStarted and ModalFinished.
It doesn't seem necessary in your case, but if you somehow need to be notified that a form/dialog is going modal, you can attach a handler to Application.OnModalBegin and Application.OnModalEnd events. You can use an TApplicationEvents component for that.
What is the proper way to use the SDK to make a dialog (which is not anchored to the add-on bar, etc. but shows centered on screen)? It doesn't seem like there is any API for this important capability. I do see windows/utils has open but I have two problems with that:
The dialog opening seems to require "chrome" privs to get it to be centered on the screen (and I'd be expectant of add-on reviewers complaining of chrome privs, and even if not, I'd like to try to stick to the SDK way).
While I can get the DOM window reference of the new window/utils' open() dialog, I'm not sure how to attach a content script so I can respond to user interaction in a way that prompts (and can respond to) privileged behavior ala postMessage or port.emit (without again, directly working with chrome privs).
Ok, this answer should have been pretty obvious for anyone with a little experience with the SDK. I realized I can just use a panel. In my defense, the name "panel" is not as clear as "dialog" in conjuring up this idea, and I am so used to using panels with widgets, that it hadn't occurred to me that I could use it independently!
Edit
Unfortunately, as per Bug 595040, these dialogs are not persistent, meaning if the panel loses focus, the "dialog" is gone... So panel looks like it is not a suitable candidate after all... :(
Edit 2
I've since moved on and have gotten things working mostly to my satisfaction with sdk/window/utils and openDialog on whose returned window I add a load listener and then call tabs.activeTab.on('ready', and then set tabs.activeTab.url to my add-on local HTML file so the ready event will get a tab to which I can attach a worker. There is still the problem with chrome privs I suppose, but at least the main communications are using SDK processes.
Update to Edit 2:
Code sample provided by request:
var data = require('sdk/self').data,
tabs = require('sdk/tabs');
var win = require('sdk/window/utils').openDialog({
// No "url" supplied here in this case as we add it below (in order to have a ready listener in place before load which can give us access to the tab worker)
// For more, see https://developer.mozilla.org/en-US/docs/Web/API/window.open#Position_and_size_features
features: Object.keys({
chrome: true, // Needed for centerscreen per docs
centerscreen: true, // Doesn't seem to be working for some reason (even though it does work when calling via XPCOM)
resizable: true,
scrollbars: true
}).join() + ',width=850,height=650',
name: "My window name"
// parent:
// args:
});
win.addEventListener('load', function () {
tabs.activeTab.on('ready', function (tab) {
var worker = tab.attach({
contentScriptFile: ....
// ...
});
// Use worker.port.on, worker.port.emit, etc...
});
tabs.activeTab.url = data.url('myHTMLFile.html');
});
if the panel loses focus, the "dialog" is gone...
It doesn't get destroyed, just hides, right? If so, depending on why it's getting hidden, you can just call show() on it again.
You'd want to make sure it's not being hidden for a good reason before calling show again. If there's a specific situation in which it's losing focus where you don't want it to, create a listener for that situation, then call if (!panel.isShown) panel.show();
For example, if it's losing focus because a user clicks outside the box, then that's probably the expected behaviour and nothing should be done. If it's losing focus when the browser/tab loses focus, just register a tab.on('activate', aboveFunction)
Simply adding ",screenX=0,screenY=0" (or any values, the zeroes seem to be meaningless) to the features screen seems to fix centerscreen.
I have a form within a tab. It is second tab so it doesn't render until you open it.
I have tried to submit data to the form with Ext.getCmp('DetailsForm').getForm().setValues(selections[0]); but it says that it is not a function. Probably because it is not rendered yet. What I have to do?
Set the deferredRender config property of your Ext.tab.Panel to deferredRender: false
That will force the rendering of all tabs instead of just active ones. Now the form will be there. As mentioned before I recommend you also to use myTabPanelRef.down('from').getForm().setValues(selections[0]); to access the form.
subscribe to the second tabs show event OR painted event
then look for the form preferably by using .down() method as this wont look with in the entire DOM.
set the values
Use render event of form panel.
Your code will be something like this -
Ext.getCmp('DetailsForm').on('render', function(){
this.getForm().load(selections[0]);
});
Before you start shooting me down i have checked for answers and i have googled till my fingers bled but i havent been able to find a simple, concise answer. So im asking again for all those that might have this problem.
Question: how to open a new window with a formpanel in side.
Context: i have an app that lists lots of items, i want someone to edit an entry, i want a new window to open so they can edit properties then hit save. A standard thing you find in a lot of applications.
Architecture:
I have one client module called UI, it has a dozen classes that draw widgets and fill a main area when selected from a menu. I have a single html page called UI.html which has the tag in the head. Thats it.
Options Ive Seen
Call Window.Open() but you need to define a html file. I dont have one. I can create an empty one but how do you inject a widget in to it ?
use jsni $wnd to create a new window and get a reference to it. But how do i inject a form panel into it ??
use a popuppanel. They look sucky - plus if opening a window through JS is quite simple i would expect it to be in gwt.
Maybe im miss understanding how to use GWT i dont know.
Any help would be appreciated
Thanks
The way i got this to work is as follows:
i wrote a jsni method to open a new window
public static native BodyElement getBodyElement() /*-{
var win = window.open("", "win", "width=940,height=400,status=1,resizeable=1,scrollbars=1"); // a window object
win.document.open("text/html", "replace");
i added a basic body to the new window and returned the body element
win.document.write("<HTML><HEAD>"+css1+css2+"</HEAD><BODY><div class=\"mainpanel\"><div style=\"width: 100%; height: 54px;\"><div id=\"mainbody\"class=\"mainbody\" style=\"width: 100%;\"></div></div></div></BODY></HTML>");
win.document.close();
win.focus();
return win.document.body;
}-*/;
i then called this method from my main java method
BodyElement bdElement = getBodyElement();
I then injected my panel which has lots of widgets into the returned body element
SystemConfiguration config = new SystemConfiguration(); bdElement.getOwnerDocument().getElementById("mainbody").appendChild(config.getElement());
I agree with Bogdan: Use a DialogBox.
If you can't, you Window.open() as you mentioned in option 1:
Create another GWT module, and form.html that will load it
Window.open("form.html?entry=54")
Have the form gwt module read from the URL, load the entry, allow it to be edited, and provide Save and Cancel buttons
Close the popup when Save or Cancel is clicked
Can't you just use a DialogBox?
Example