Dynamically set iframe src in a XUL window?

Talk about code development, features, specific bugzilla bugs, enhancements, patches, and other highly technical things.
Forum rules
Please keep everything here strictly on-topic.
This board is meant for Pale Moon source code development related subjects only like code snippets, patches, specific referenced Bugzilla bugs, mercurial, etc.

This is not for tech support! Please do not post tech support questions in the "Development" board!
Please make sure not to use this board for support questions. Most "bug reports" do not belong in this board and should initially be posted in Community Support or other relevant support boards.

Please keep things on-topic as this forum will be used for reference for Pale Moon development. Expect topics that aren't relevant as such to be moved or deleted.
Post Reply
User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-17, 13:19

I'm spawning a XUL window to display the Youtube video that's currently open in a tab. The XUL window has an iframe, using their standard iframe embed code I want to set the src at runtime.

I'm doing it like so but the frames listed are 0, and I can't use 'getElementbyID() on the iframe's name either -

Code: Select all

			pmplayerwindowref = window.open("chrome://pmplayer/content/window-youtube.xul", "pmplayerwindow",
				  "chrome,width=640,height=480,resizable=yes,dialog, alwaysRaised,centerscreen");
		pmplayerwindowref.frames[0].setAttribute('src',PMPlayer.Launch.playerIframeSrc);

The XUL window looks like this -

Code: Select all

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="chrome://pmplayer/skin/overlay.css" type="text/css"?>
<!DOCTYPE window SYSTEM "chrome://pmplayer/locale/pmplayer.dtd" >
<window id="pmplayer-window" title="PMPlayer" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" fullscreenbutton="true" disablefastfind="true" onunload="PMPlayer.Launch.closeWindow()" >
		<script type="application/x-javascript" src="youtubeplayer.js" />
		<script type="application/x-javascript" src="launch.js" />
		<vbox>
				<iframe id="pmplayer-iframe" type="content"/>
				<hbox>
						<button id="pmplayer-playpause"/>
				</hbox>
		</vbox>
</window>
How do I get the reference to the iframe to set it?
I've confirmed that I can load the video if I simply hardcode it, for example setting the iframe src to

Code: Select all

https://www.youtube.com/embed/VIDEOID?enablejsapi=1&modestbranding=1
so it does work. My extension runs a web progress listener to detect if a youtube link was loaded, and makes a button and menu option visible if that's the case. The button/menu will launch a new XUL window with an iframe that has the video embedded in it.

This is to be an overlay version of the Jetpack based 'Youtube Video Player Pop Out' from CAA with a few additional features (support for a few other video sites as well) and enhancements.
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

vannilla
Keeps coming back
Keeps coming back
Posts: 995
Joined: 2018-05-05, 13:29

Re: Dynamically set iframe src in a XUL window?

Post by vannilla » 2020-01-17, 15:16

eMatrix uses an iframe for its popup panel and the src attribute cycles popup.html (when open) and about:blank (when closed.)
However the iframe is generated dynamically with createElement when the window is ready; maybe you can do the same.
Also, what happens if you move the scripts after you declare the vbox? Can you access the frame?

User avatar
JustOff
Localization Coordinator
Localization Coordinator
Posts: 1964
Joined: 2015-09-03, 19:47
Location: UA
Contact:

Re: Dynamically set iframe src in a XUL window?

Post by JustOff » 2020-01-17, 16:55

1. Perhaps you should include document in the reference, i.e.:

Code: Select all

pmplayerwindowref.document.frames[0].setAttribute('src',PMPlayer.Launch.playerIframeSrc);
2. You will also likely have to wait until window-youtube.xul is ready, i.e.

Code: Select all

if (pmplayerwindowref.document.readyState=="complete") {...}
or use the onload script in the xul window to tell the main routine that the player window is ready.
Here are the add-ons I made in a spare time. That was fun!

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-18, 09:35

vannilla wrote:
2020-01-17, 15:16
Also, what happens if you move the scripts after you declare the vbox? Can you access the frame?
JustOff wrote:
2020-01-17, 16:55
Perhaps you should include document in the reference, i.e.:

Code: Select all

pmplayerwindowref.document.frames[0].setAttribute('src',PMPlayer.Launch.playerIframeSrc);
Tried both of these, didn't work :(
For the readyState change, I tried -

Code: Select all

		pmplayerwindowref.document.onreadystatechange = function () {
		    if(pmplayerwindowref.document.readyState=="complete"){
			PMPlayer.Debug.log('document loading complete');
			pmplayerwindowref.document.frames[0].setAttribute('src',PMPlayer.Launch.playerIframeSrc);
		    }
		}
but it isn't being invoked.
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

User avatar
New Tobin Paradigm
Off-Topic Sheriff
Off-Topic Sheriff
Posts: 7339
Joined: 2012-10-09, 19:37
Location: Binary Outcast

Re: Dynamically set iframe src in a XUL window?

Post by New Tobin Paradigm » 2020-01-18, 09:50

You shouldn't be using an iframe anyway as that has security issues when opening websites. You SHOULD be using a browser element so that it is isolated from a privileged chrome document.

https://developer.mozilla.org/en-US/doc ... XUL/iframe

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-18, 10:06

But can I just embed the video and nothing else in a browser element, or is it only for rendering webpages? Setting type=content in iframe is supposed to prevent the remote page from accessing chrome.
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

User avatar
New Tobin Paradigm
Off-Topic Sheriff
Off-Topic Sheriff
Posts: 7339
Joined: 2012-10-09, 19:37
Location: Binary Outcast

Re: Dynamically set iframe src in a XUL window?

Post by New Tobin Paradigm » 2020-01-18, 10:12

This area hasn't been of prime concern for Mozilla to care about for over 10 years. I think it is better to just be on the safe side and use a browser element that way you can tie into navigational events and even control navigation using well established methods. Which seem to be a good fit for what you are wanting to achieve. Also be able to manage the content click events and context menu.

Didn't I tell you this like several months ago or am I imagining it.

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-18, 10:21

New Tobin Paradigm wrote:
2020-01-18, 10:12
Didn't I tell you this like several months ago or am I imagining it.
Yes, you did, now that you mentioned it. Damn. I had gotten busy with other things and recently returned to this - completely forgot about what you'd said. I'll give this approach a try.
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

User avatar
Moonchild
Pale Moon guru
Pale Moon guru
Posts: 27036
Joined: 2011-08-28, 17:27
Location: 58°2'16"N 14°58'31"E
Contact:

Re: Dynamically set iframe src in a XUL window?

Post by Moonchild » 2020-01-18, 14:14

New Tobin Paradigm wrote:
2020-01-18, 09:50
You shouldn't be using an iframe anyway as that has security issues when opening websites.
Remember what I posted here: viewtopic.php?f=5&t=23025&p=175707#p175704
Don't load any remote content you don't control directly in a Chrome window. Using an iframe is doing just that; embedding a browser component properly sandboxes it.
"There will be times when the position you advocate, no matter how well framed and supported, will not be accepted by the public simply because you are who you are." -- Merrill Rose
Image

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-18, 14:33

Ok, I'm trying it with a browser now, but same problem as before - how do I manipulate it from my script? window.content and window.document both return null, and getElementByID() is not a part of the window object.
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

User avatar
New Tobin Paradigm
Off-Topic Sheriff
Off-Topic Sheriff
Posts: 7339
Joined: 2012-10-09, 19:37
Location: Binary Outcast

Re: Dynamically set iframe src in a XUL window?

Post by New Tobin Paradigm » 2020-01-18, 14:50

You would likely need to inject your scripting into the browser content like any other content manipulation extension.

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-18, 15:02

I don't want to manipulate content - just want to set the URL for the browser component to the Youtube video to be played. I was looking at something similar to window.getElementbyID(browser).setAttribute(src,my youtube link).
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

User avatar
New Tobin Paradigm
Off-Topic Sheriff
Off-Topic Sheriff
Posts: 7339
Joined: 2012-10-09, 19:37
Location: Binary Outcast

Re: Dynamically set iframe src in a XUL window?

Post by New Tobin Paradigm » 2020-01-18, 15:35


User avatar
Moonchild
Pale Moon guru
Pale Moon guru
Posts: 27036
Joined: 2011-08-28, 17:27
Location: 58°2'16"N 14°58'31"E
Contact:

Re: Dynamically set iframe src in a XUL window?

Post by Moonchild » 2020-01-18, 18:52

You'd want to use loadURI
"There will be times when the position you advocate, no matter how well framed and supported, will not be accepted by the public simply because you are who you are." -- Merrill Rose
Image

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-01-19, 04:51

I'm unable to even get the reference to the browser object, let alone call any methods on it.

Changed the iframe tag to

Code: Select all

<browser id="pmplayer-browser" type="content-primary"/>
but after saving the reference to the XUL window from the window.open() call - I'm flummoxed as to what next. Have tried type=content as well for the browser.

To recap, I have

Code: Select all

pmplayerwindowref = window.open("chrome://pmplayer/content/window-youtube.xul", "pmplayerwindow",
				  "chrome,width=640,height=480,resizable=yes,dialog, alwaysRaised,centerscreen")
and after this, pmplayerwindowref.getElementbyID() is not a valid call, and both .document and .content are null, so now how do I access the pmplayer-browser contained within?
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

User avatar
moonbat
Board Warrior
Board Warrior
Posts: 1605
Joined: 2015-12-09, 15:45

Re: Dynamically set iframe src in a XUL window?

Post by moonbat » 2020-05-12, 07:04

Back to developing this using the experience gained from porting Pure URL to XUL :D

Wasn't sure if I wanted to start a new thread for essentially the same problem, but using a <browser> element as suggested. I've figured out how to access the browser element directly in the new window.

This is the popup window - (commented out the button display for now, I'm also facing layout issues with the below)

Code: Select all

<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/css" href="chrome://global/skin/"?>
<?xml-stylesheet type="text/css" href="chrome://myext/skin/overlay.css"?>
<!DOCTYPE window SYSTEM "chrome://myext/locale/myext.dtd" >
<window
	xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
	xmlns:html="http://www.w3.org/1999/xhtml" fullscreenbutton="true"
	disablefastfind="true" id="myext-window" title="myext">
	<script type="application/x-javascript"
		src="chrome://myext/content/windowscript.js" />
	<groupbox>
		<grid flex="1">
			<columns>
				<column flex="1" />
			</columns>
			<rows>
				<row>
					<browser id="myext-browser" type="content"  flex="1"/>
				</row>
<!-- 				<row>
					<hbox>
						<button id="myext-playpause" />
					</hbox>
				</row>
 -->			</rows>
		</grid>
	</groupbox>
</window>
and this is windowscript.js referenced above -

Code: Select all

var embed = null;
myext = {
		init:function(){
			globals.mycommand.setAttribute("disabled","true");
			embed=document.getElementById("myext-browser");
			console.log("Initial URL Is "+embed.currentURI.spec);
//			embed.src=globals.frameEmbed;
			console.log("frameEmbed is"+globals.frameEmbed);
			embed.loadURI(globals.frameEmbed);
			console.log("Current URL Is "+embed.currentURI.spec);
		},
		closeWindow:function(){
			globals.mycommand.removeAttribute("disabled");
		}
}
window.addEventListener("load", myext.init,false);
Even after setting the URI, the console output shows

Code: Select all

Initial URL Is about:blank  

frameEmbed is https://www.youtube.com/embed/e94Hcfc--jw?enablejsapi=1&modestbranding=1  

Current URL Is about:blank
Why doesn't the browser load the embed? I have also tried setting the src property (commented out in above code), with the same result, and replaced the browser with an iframe - in the latter case the src is set correctly but it doesn't load.
"One hosts to look them up, one DNS to find them and in the darkness BIND them."

Linux Mint 20 Xfce x64 on HP i5 laptop with 12 GB RAM, always latest versions of PM & Basilisk unless specified.

Post Reply