UI5 Opening new Window that is always on top - javascript

I'm trying to open a new window with a specific content e.g. it is displaying another view that i've created. The opened window/popup/dialog has to always on top and draggable. While it is on top I want to edit and work on the background window.
Is this possible? If it is, how can I let the opened window/popup/dialog display another view or add some conent to it?
I've tried to open a new window with a simple js function window.open(),
but I cannot let it be on top and edit some background window content.
Maybe there are other ways to do so? Maybe some UI5 methods will accomplish what I'm looking for?

I am sorry to say, but there is no standard way to do so.
Windows are managed by your browser, so you can open it in a new window, but it is not part of the initial application if you do so. If you want to use windows you could open a new app in the new window. here is a post on how the communication between those apps can work: Communication between tabs or windows
Popovers allow you to access the rest of the app while they are open, but once you do the popover closes. There is a property, that stops it from closing, but this property also blocks the wished for interaction. (the property is named modal check here: https://ui5.sap.com/#/api/sap.m.Popover/) Like every UI5 Element it can be made draggable, refer to https://ui5.sap.com/#/api/sap.ui.core.dnd.DragDropBase.
Dialogs do not allow any interaction with the rest of the app and i did not find a way to bypass it. Its has a build in feature for drag and drop though.
However
If you can do without the draggable part there is a way you can make it kind of work. It will only work as intended on desktops or large enough tablets.
You can use the FlexibleCollumnLayout and open your content in a new column. That allows you to interact with the "Dialog" Content at the same time as the content of you main page. Like this the "Dialog" will always be to the side, so it is not draggable.
If you really want to have the draggable part you would have to create a custom control. Read up on the topic here: https://ui5.sap.com/#/topic/8dcab0011d274051808f959800cabf9f
I hope I could help you,
Eric

Thanks for you answer, but I found a solution in the meantime with this help:
https://github.com/SAP/openui5/issues/1022
By setting oDialog.oPopup.setModal(false); it is able to even set a sap.m.Dialog non-modal. Then I set draggable: true resizable: true and gave it a styleclass with a very high z-Index and got exactly what I was looking for. A non-modal sap.m.Dialog, that is draggable and always on top of everything while the background can still be edited.

Related

How can I remove the moz-extension:// in the popup window Firefox extension created?

Currently, I'm developing an Firefox extension app. It will open a html file in a new popup window. When the poup window opened, it shows the title as format: "moz-extensions://", does anyone know how can I remove the prefix, the "moz-extension://"?
Thank you very much!
Answer
According to this bug report you can't currently do anything about it. It is present to prevent spoofing/phishing attacks against the user (acting like the popup is part of a UI).
Statement (Quote):
We've been trying to make it clear that when something happens, the
reason for it is clear to the end user. The ability to create a popup
with no URL bar means that there could be absolutely no info to the
user.
Custom Solution
If you want to have a popup with a custom title you would be better off creating your own HTML/CSS solution!

Create a html window within another html window

I currently have a page with a few buttons. When I click on the button I want to open a new html page within the parent page. I want to do this in such a way that the parent window becomes transparent and the new page is over it. How can I go about doing this? I have tried to use Iframes but it does not give me the output that I want.
James Kirsch has given you one way to do it. Another is to have a hidden DIV that you show when you need it. In both cases, you may have to place a semi-transparent GIF image behind the DIV (or opened window) so someone can not do anything with the rest of the web page until they have finished interacting with the new window. You can do this by using the z-index CSS command. So the DIV would be:
<DIV style='z-index:100;'>....</DIV>
and the image would be something like
<img src="PUT YOUR PATH HERE" style='position:absolute;top:0%;left:0%;width:100%;height:100%;z-index:50;'>
This would put the GIF image halfway between the web page and the DIV.
The above is what is happening when you go to a website and they grey out everything behind the new window. It also keeps people from pushing on buttons when you don't want them to do so.
IFRAME stands for something like INSERTED_FRAME where the "INSERTED" part means it is inserted into your pre-existing web page. That is why it doesn't work. Neither will the FRAME command work because (again) it is embedded into the pre-existing web page. You are wanting to lay the new window on top of the web page. Thus, Mr. Kirsch' answer and my own. Note that you can also use a TABLE command to do the same thing - even if it is frowned upon to use tables presently. It is the STYLE part of the command that causes the HTML element to appear above the rest of the web page and not any particular HTML command itself. Also, the "position:absolute" part of the STYLE command is what overrides the web page's positioning of the element. Have fun!
In the Javascript have you considered using the following?
window.open();
This call appears to take parameters for Position and Size, you may be able to close the previous window also if you desire, or manipulate it.
Example:
window.open('this.html','','left=15,top=15,width=800,height=600');
Reference: here

When opening a 'child window' from the main site do i have to create an HTML page for each child window or is there a way to make it generate its own?

I am programming a website that has products for sale and need to know how to specifically set up child windows. Do i have to create a child window for EACH image or is there a standard page that the code can assign it to?
Using "popup" windows can be troublesome.. some browsers will not open them properly due to their internal "popup blockers"
but to answer your question. if you set the URL of the window to the image itself it should load in the window without the need for a page.
i.e. http://www.example.com/img/myimage.jpg
A better way to do this would be using a javascript library such as jQuery and jQuery-UI to open modal overlays.

Javascript for removing menu and scroll bars

I have this script on my html page:
<script language='javascript'>parent.resizeTo(550,510);</script>
I'd like to add to it so it positions the window in the middle of the screen. Also, I want to remove the address and tool bars (I've managed to hide the scrollbars by using body{overflow:hidden;}).
I know how to do this using JS upon opening a new window from the browser but this needs to work from clicking a link on a PDF.
Does anyone have any suggestions? Thank you!
You can't remove address bars, etc. from the user's browser window (even if the user is only you) unless you create a new window object. And the trend is toward removing more and more of your ability to "customize" such popup windows, for security reasons.
This is actually a feature, not a bug. Think about it.
If you're opening a browser window from a separate application, the page starts off its life with a completely-decorated browser window. There's no way to make those decorations go away after the page is loaded.
While I seriously doubt the justification of your desires the way to do it is to somehow open a window. That means that your pdf links to a page that as its action will open a window with an url that has the actual content. The pdf links to a page that is basically a redirector. You give the final URL as a parameter and launch it. Of course you need to disable the popup blocker for this to work, but you should not even consider doing this on a public (no browser control) website anyway. You also might want to add to the redirector page a button that the user can click to open the page if it was blocked by the popup blocker.

Hiding statusbar using Javascript

How can we hide the statusbar of a current page using javascript.I used window.statusbar.visible = false but its not working.Please give me a solution
regards
Arun
I don't think you can hide it for an already opened window : it's not an element of the page, but an element of the browser's user interface -- which means it's outside of your concern.
(Even if you can open a new window that doesn't have a status-bar ;; which might not be liked that much by some users, btw)
Status bars are something people expect to see in every browser window. By not hiding it, you give users the first sense of safety that the content they see is still being served within a browser. You may be trying to simulate a desktop application experience on the web. But once you code for the web, you have to happily accept the standard elements that come with it.
Technically, no, you cannot hide the status bar after opening the window.

Categories