logo

The ConnectWise Control forum has moved to ConnectWise University! This forum has been locked and is in read-only mode. Click here for instructions on how to access the new forum.

Welcome Guest! You can not login or register.

Notification

Icon
Error
Add JavaScript to head tag
Options
Go to last post Go to first unread
Previous Topic Next Topic
jeffshead  
#1 Posted : Tuesday, September 26, 2017 11:17:17 PM(UTC)
jeffshead


Rank: Member

Joined: 10/22/2015(UTC)
Posts: 31
United States

Thanks: 1 times
I tried creating an extension that would add some JavaScript code to the Guest page but I cannot get it to work.

I used the following schema in "Initializer.js":
Code:

SC.event.addGlobalHandler(SC.event.PreRender, function (eventArgs) {
	if (SC.context.pageType == 'GuestPage')
	{
		var newWin = null;
                function popUp(strURL, strType, strWidth, strHeight) {
                   LeftPosition = (screen.width) ? (screen.width-strWidth)/2 : 0;
                   TopPosition = (screen.height) ? (screen.height-strHeight)/2 : 0;
                   if (newWin != null && !newWin.closed)
                        newWin.close();
                   var strOptions="";
                   if (strType=="consoleC")
                       strOptions="resizable,top="+TopPosition+',left='+LeftPosition+",height="+
                       strHeight+",width="+strWidth;
                   newWin = window.open(strURL, 'newWin', strOptions);
                   newWin.focus();
                }
	}
});


I have some links in the "JoinPanel.SupportPromptMessage" that I would like to open in a new window, with a specified size, when they are clicked. The JavaScript code works if I simply paste it to the end of the "Global.js" file.

I also would like to know how to include a JavaScript file, instead of pasting the code directly into an extension. Lastly, how would you include a JavaScript file, site-wide?
Back to top

Back to top  
Scott  
#2 Posted : Wednesday, October 4, 2017 11:02:45 AM(UTC)
Scott


Rank: Administration

Medals: Level 4: Wise Old Owl! Received 100 Thanks!

Joined: 3/28/2014(UTC)
Posts: 2,862
United States

Thanks: 3 times
Was thanked: 351 time(s) in 303 post(s)
Stepping back, what exactly are you trying to add? Are you wanting to add a Guest action panel with links that, when clicked, opens a new tab or window?

Quote:
I also would like to know how to include a JavaScript file, instead of pasting the code directly into an extension.


Sorry again, not sure that I'm following though, do you want to include an external javascript file?

Quote:
Lastly, how would you include a JavaScript file, site-wide?

Extensions contain a Manifest.xml file which can contain multiple components. One of these components can be a ClientScriptInitializer and when included, said javascript file is automatically included site-wide assuming the extension is enabled.

Code:

<ClientScriptInitializer SourceFile="Initializer.js" />


It doesn't have to be named Initializer.js, infact it would probably make debugging easier down the road if it wasn't.
ScreenConnect Team
Back to top
jeffshead  
#3 Posted : Wednesday, October 4, 2017 11:47:57 AM(UTC)
jeffshead


Rank: Member

Joined: 10/22/2015(UTC)
Posts: 31
United States

Thanks: 1 times
Sorry if my questions were not clear. I responded in-line, below:

Originally Posted by: Scott Go to Quoted Post
Stepping back, what exactly are you trying to add? Are you wanting to add a Guest action panel with links that, when clicked, opens a new tab or window?
Quote:
I also would like to know how to include a JavaScript file, instead of pasting the code directly into an extension.

I have enabled 'JoinPanel.SupportPromptVisible' on the guest page. I have included links, in that pop-up, that use JavaScript to open the linked page in a new window, of a particular size. I have already created an extension that includes the necessary JavaScvript code to open the pre-sized window but it does not work with 'JoinPanel.SupportPromptVisible'. However, if I paste the same JavaScript code to the bottom of the 'Global.js' file, it works.

Originally Posted by: Scott Go to Quoted Post
Sorry again, not sure that I'm following though, do you want to include an external javascript file?
Quote:
Lastly, how would you include a JavaScript file, site-wide?

I was asking what is the code to include an external JavaScript file rather than pasting the actual JavaScript code of an external file into the "Initializer.js" file of an extension. When I was asking about site-wide, I was asking how do I include JavaScript that would apply to all pages instead of using the following that applies only to the guest page assuming an extension is being used:
Code:
if (SC.context.pageType == 'GuestPage')
Is 'JoinPanel.SupportPromptVisible' an iframe? Is that why the code above does not work with the pop-up?


Originally Posted by: Scott Go to Quoted Post
Extensions contain a Manifest.xml file which can contain multiple components. One of these components can be a ClientScriptInitializer and when included, said javascript file is automatically included site-wide assuming the extension is enabled.
Code:

<ClientScriptInitializer SourceFile="Initializer.js" />

It doesn't have to be named Initializer.js, infact it would probably make debugging easier down the road if it wasn't.

I already have this in my 'Manifest.xml'. I neglected to include all of the code in my previous post. I have created a couple of "test" extensions that do work as expected so I understand the basic concept but the code I included in my original post does not work on the links in the 'JoinPanel.SupportPromptVisible'.
Back to top
Scott  
#4 Posted : Friday, October 6, 2017 11:41:35 AM(UTC)
Scott


Rank: Administration

Medals: Level 4: Wise Old Owl! Received 100 Thanks!

Joined: 3/28/2014(UTC)
Posts: 2,862
United States

Thanks: 3 times
Was thanked: 351 time(s) in 303 post(s)
Quote:
Is 'JoinPanel.SupportPromptVisible' an iframe? Is that why the code above does not work with the pop-up?


No, I believe it's just a div created within our modal dialog framework.

As to why it's not working I'm not sure, are you attempting to override the prototype for window.open()? You could try not adding the handler to the PreRender and just instead load it into the DOM directly (but likely still filtering on the page type).

What does the code look like that invokes your 'popUp' method?
ScreenConnect Team
Back to top
jeffshead  
#5 Posted : Friday, October 6, 2017 12:58:42 PM(UTC)
jeffshead


Rank: Member

Joined: 10/22/2015(UTC)
Posts: 31
United States

Thanks: 1 times
Originally Posted by: Scott Go to Quoted Post
Quote:
Is 'JoinPanel.SupportPromptVisible' an iframe? Is that why the code above does not work with the pop-up?


No, I believe it's just a div created within our modal dialog framework.

As to why it's not working I'm not sure, are you attempting to override the prototype for window.open()? You could try not adding the handler to the PreRender and just instead load it into the DOM directly (but likely still filtering on the page type).

What does the code look like that invokes your 'popUp' method?


I simply want the page that is linked in 'JoinPanel.SupportPromptMessage' to open in a new window, of the size specified.

Below is the code I have for the 'JoinPanel.SupportPromptMessage' pop-up:
Code:
<p style="font-weight:bold;">You must accept our <a href="https://www.mysite.com/support/index.php?/Knowledgebase/Article/View/1345/15/remote-support-policy" target='_blank' onclick="popUp(this.href,'elasticNoC',1010,725);return false;">Terms & Conditions</a> before continuing.</p>


Below is the code for my extension:
Initializer.js:
Code:

SC.event.addGlobalHandler(SC.event.PreRender, function (eventArgs) {
	if (SC.context.pageType == 'GuestPage'){
		// JavaScript Document
		var newWin = null;
		function popUp(strURL, strType, strWidth, strHeight) {
		LeftPosition = (screen.width) ? (screen.width-strWidth)/2 : 0;
		TopPosition = (screen.height) ? (screen.height-strHeight)/2 : 0;
		 if (newWin != null && !newWin.closed)
		   newWin.close();
		 var strOptions="";
		 if (strType=="consoleC")
		   strOptions="resizable,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		 if (strType=="fixedC")
		   strOptions="status,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		 if (strType=="elasticC")
		   strOptions="toolbar,menubar,scrollbars,"+
		     "resizable,location,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		if (strType=="elasticNoC")
		   strOptions="scrollbars,"+
		     "resizable,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		if (strType=="console")
		   strOptions="resizable,height="+
		     strHeight+",width="+strWidth;
		 if (strType=="fixed")
		   strOptions="status,height="+
		     strHeight+",width="+strWidth;
		 if (strType=="elastic")
		   strOptions="toolbar,menubar,scrollbars,"+
		     "resizable,location,height="+
		     strHeight+",width="+strWidth;
		if (strType=="elasticNo")
		   strOptions="scrollbars,"+
		     "resizable,height="+
		     strHeight+",width="+strWidth;
		 newWin = window.open(strURL, 'newWin', strOptions);
		 newWin.focus();
		}
     }
});


manifest.xml:
Code:

<?xml version="1.0" encoding="utf-8"?>
<ExtensionManifest>
	<Version>1.0</Version>
	<Name>TEST - Add Window Resize JS</Name>
	<Author></Author>
	<ShortDescription>The bare minimum needed for a new extension.</ShortDescription>
	<Components>
		<ClientScriptInitializer SourceFile="Initializer.js" />
	</Components>
</ExtensionManifest>


My extension does not work but if I simply delete or disable the extension and paste the following code to the bottom of the 'Global.js' file, it works.
Code:

// JavaScript Document
		var newWin = null;
		function popUp(strURL, strType, strWidth, strHeight) {
		LeftPosition = (screen.width) ? (screen.width-strWidth)/2 : 0;
		TopPosition = (screen.height) ? (screen.height-strHeight)/2 : 0;
		 if (newWin != null && !newWin.closed)
		   newWin.close();
		 var strOptions="";
		 if (strType=="consoleC")
		   strOptions="resizable,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		 if (strType=="fixedC")
		   strOptions="status,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		 if (strType=="elasticC")
		   strOptions="toolbar,menubar,scrollbars,"+
		     "resizable,location,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		if (strType=="elasticNoC")
		   strOptions="scrollbars,"+
		     "resizable,top="+TopPosition+',left='+LeftPosition+",height="+
		     strHeight+",width="+strWidth;
		if (strType=="console")
		   strOptions="resizable,height="+
		     strHeight+",width="+strWidth;
		 if (strType=="fixed")
		   strOptions="status,height="+
		     strHeight+",width="+strWidth;
		 if (strType=="elastic")
		   strOptions="toolbar,menubar,scrollbars,"+
		     "resizable,location,height="+
		     strHeight+",width="+strWidth;
		if (strType=="elasticNo")
		   strOptions="scrollbars,"+
		     "resizable,height="+
		     strHeight+",width="+strWidth;
		 newWin = window.open(strURL, 'newWin', strOptions);
		 newWin.focus();
		}
Back to top
jeffshead  
#6 Posted : Saturday, May 5, 2018 3:51:38 PM(UTC)
jeffshead


Rank: Member

Joined: 10/22/2015(UTC)
Posts: 31
United States

Thanks: 1 times
Finally figured out how to get this to work.

I moved my JS code to a separate file named resize.js.

Below is the code for my extension:
Initializer.js:
Code:

SC.util.includeScript(extensionContext.baseUrl + 'resize.js');
Back to top
Users browsing this topic
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.

Powered by YAF.NET | YAF.NET © 2003-2021, Yet Another Forum.NET