I am opening a popup window:
browser.windows.create({
allowScriptsToClose: true, // FF Only
url : "pop_main.html",
type : "popup", // normal, popup, panel, detached_panel
// focused : true, FF NOT SUPPORTED
width : 750,
height : 520
}, function (pop) {
popup_id = pop.id;
});
Problem is that the window is Modal, as in "always on top", over all FireFox windows.
I would like it to behave like a normal window in that regard. Reason for using "popup" is that the window should not have address-bar, window-menus etc.
Is this possible?
Related
i tried this code but still dos't work for me.
When the user clicks on an input field, the soft keyboard that pops up hides the input field when the latter is relatively low on the screen. The page is scrollable, so the user can scroll and see the field again, but the customer requirements define that the page will auto-scroll until the field is visible.
There is not simple way to solve this. I solved using a handler like this:
this.keyboardShowHandler = function (e) {
that.scroll.disable();
that.$el.css('bottom', (e.keyboardHeight - 30) + "px");
that.scroll.refresh();
that.scroll.scrollToElement(document.activeElement, 0, true, true);
};
this.keyboardHideHandler = function () {
setTimeout(function () {
if (!cordova.plugins.Keyboard.isVisible) {
that.$el.css('bottom', "0px");
that.scroll.scrollTo(0, -100, 0);
that.scroll.enable();
that.scroll.refresh();
}
}, 300);
};
window.addEventListener('native.keyboardshow', this.keyboardShowHandler);
window.addEventListener('native.keyboardhide', this.keyboardHideHandler);
But I am using iscroll, jquery and cordova keyboard plugin. You might want to adapt to your frameworks
I have a CustomizableUI.jsm button i add to the toolbar. On click of this it opens a panel which has a chrome page loaded.
I want all windows to open this same panel. So my thought was to add the panel to Services.appShell.hiddenDOMWindow and then open it anchored to the the CustomizableUI.jsm button.
However I'm having trouble adding the panel to the hidddenDOMWindow.
This code works fine from scratchpad if you make the first line be var win = window. But if you make it be var win = Services.appShell.hiddenDOMWindow it has trouble appending the panel to the popupset. So weird.
Code here is the appShell hidden window code. If you make it var win= window it works fine:
var win = window; //Services.appShell.hiddenDOMWindow;
var panel = win.document.createElementNS('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul','panel');
var props = {
type: 'arrow',
style: 'width:300px;height:100px;'
}
for (var p in props) {
panel.setAttribute(p, props[p]);
}
var popupset = win.document.createElementNS('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul','popupset');
popupset.appendChild(panel);
win.document.documentElement.appendChild(popupset);
panel.addEventListener('popuphiding', function (e) {
e.preventDefault();
e.stopPropagation();
//panel.removeEventListener('popuphiding', arguments.callee, false); //if dont have this then cant do hidepopup after animation as hiding will be prevented
panel.addEventListener('transitionend', function () {
panel.hidePopup(); //just hide it, if want this then comment out line 19 also uncomment line 16
//panel.parentNode.removeChild(panel); //remove it from dom //if want this then comment out line 18
}, false);
panel.ownerDocument.getAnonymousNodes(panel)[0].setAttribute('style', 'transform:translate(0,-50px);opacity:0.9;transition: transform 0.2s ease-in, opacity 0.15s ease-in');
}, false);
panel.openPopup(window.document.documentElement, 'overlap', 100, 100);
I'm having a strange problem with the jquery dialog popup that I'm hoping someone here can help. The pop up codes looks like below. It works fine except for one thing. When the pop-up is displayed, it will sometimes push the background content down by about the height of the the dialog window. Is there a way to prevent this from happenning?
$("#searchPopUp").dialog({
modal: true,
bgiframe: false,
autoOpen: false,
resizable: true,
position:{ my: "center", at: "center", of: window },
title: 'Choose one search criteria and<br/>populate the corresponding field below:',
width: 400,
close: function( event, ui ) {},
buttons: {
"Search": function() {
$("#viewDevicesSearchForm\\:searchCommandLink").click();
},
"Close": function() {
$( this ).dialog( "close" );
}
}
});
This is because jquery sets position to relative, and then moves the popup to the right place using top and left. I found two ways to fix the problem:
1) The easier of the two: set margin-bottom of the dialog container to negative its height.
popup.dialog({
...other options...,
open : function() {
popup.css('margin-bottom', 0 - popup.height());
},
});
2) For the dialog container, set the position to absolute and adjust the top and left. To put it in the right place, add the offset position of where it is getting placed to the top value that jquery set. The calculation is similar for left.This should do it, but different parameters to the dialog may require different calculations.
Everytime I click on the jQuery UI dialog title bar, or the close button, the whole dialog first scrolls up to the top of the screen without triggering any ui events. Then I have to click a second time in order for the close event to be triggered.
Here is my code:
var dialog = $(selector).dialog(
{
autoOpen : true,
modal : true,
title : title,
overlay : {
opacity : "0.1",
background : "black"
},
width : dWidth,
height : dHeight,
autoResize: false,
resizable : true,
effect: 'fade',
zIndex: 100,
close: function(ev, ui) {
if(callback){
callback();
}
}
I have tried to remove all the properties but I still get the bug. I am on jQuery UI 1.8.23, but the same bug appears on 1.9.1.
Any help would be appreciated.
I thing that you have some problems in close: option. Try to remove it or edit it and see what's going on.
Try to put width : dWidth + 'px',
Also try to remove semi colon on callback.
close: function(ev, ui) {
if(callback){
callback()
}
}
It's a bug: http://bugs.jqueryui.com/ticket/3623
Upgrade your jqueryui
This was happening to me in IE, it was not just when clicking buttons but any click after scroll down. Solution was updating jQuery UI http://code.jquery.com/ui/1.11.4/jquery-ui.js
I am working on a councelor portal which is a part of our project in company and my boss advised me to use kendow windo pop control for popups on certain links.
I have done it by using the kendo application control but a little problem arouse which makes my look and feel bad a little.
we got links on one page and our application is supposed to show use popup window when any of the link will be clicked but when I actually runs the page then a popup kendo window comes first and when I minimize it or close it then link starts working according to our desire.
I am sure there is some problem with jquery code which shows the popup window on document.ready(function(){}); but it should work when a link is clicked.
I am posting my code here please help me out to make it more refined and good looking
var window = $("#window"),
undo = $("#undo")
.bind("click", function () {
window.data("kendoWindow").open();
window.data("kendoWindow").center();
undo.hide();
});
var onClose = function () {
undo.show();
}
if (!window.data("kendoWindow")) {
window.kendoWindow({
width: "600px",
height: "500px",
draggable: false,
actions: ["Minimize", "Maximize", "Close"],
resizable: false,
title: "Report Activity",
content: "../../AlertCounselor.htm",
close: onClose
});
}
HTML:
<div id="window"></div>
<label id="undo" style="display:none; width:200px;" class="k-group" >Alert Counselor</label>
If you don't want the window to be displayed when the document is loaded, you should specify visible: false in the initialization (check documentation here ).
Lets assume that you have the following link:
Click here for opening the window and not before
Then define the window as:
var myWindow = window.kendoWindow({
visible : false,
width : "600px",
height : "500px",
draggable: false,
actions : ["Minimize", "Maximize", "Close"],
resizable: false,
title : "Report Activity",
content : "../../AlertCounselor.htm",
close : onClose
}).data("kendoWindow");
This should leave the window closed waiting for something else that open it.
Finally define a click event handler for the link:
$("#open").on("click", function() {
myWindow.open();
});