Help with embedding JavaScript page

[bekdavis]

I have this page: http://www.bekdavis.com/jcarousel/examples2/diane.html

and I need to embed it on the following page: http://www.scentsy.com/diane

http://www.scentsy.com/diane - I can only add a small snip of code to this page & I do not want it to be in a frame.

What would the code look like?

Thanks in advance!!!
bek davis

[ivosilva]

Hello, bekdavis!

I don't know how to measure a "small snip of code" but here is one way you could do it:

- create a JavaScript file with a function that makes an XML HTTP Request (Ajax) to the page you wish to include. Also place a call to that same function in this file.

- in the main page include the JavaScript file and a placeholder for the request response.

Best regards.

[Nepomuk]

Maybe an iframe? Or would that still count as a frame for you?

But I must admit, I don't see where this is connected to Java at all. If you could explain that, this might be the right place. Otherwise I'd be happy to move this thread somewhere else for you (e.g. the HTML / CSS or the JavaScript / Ajax Forum).

Greetings,
Nepomuk

[bekdavis]

here we go....

the following page is a combo of html and java that I made. http://www.bekdavis.com/jcarousel/examples2/diane.html

I need to make the above page display on the following page: http://www.scentsy.com/diane

I cannot just copy and paste the HTML code b/c I am limited on the amount of code I am able to use. The page http://www.scentsy.com/diane is a replicating Network Marketing site and I am only allowed to put a tiny bit of code into the page to personalize it.

I want to be able to "display" all of the content that is on the page I created (http://www.bekdavis.com/jcarousel/examples2/diane.html).

I have tried the following and it does not work:

<object
type="text/x-scriptlet"
width=475 height=1024 data="http://www.bekdavis.co m/jcarousel/examples2/diane.html">
</object>

also...

<!--#include file="http://www.bekdavis.co m/jcarousel/examples2/diane.html" -->


is there a way to place some java code on http://www.scentsy.com/diane to make my HTML created page display?

does this make sense?

[Nepomuk]

Well, I checked that first site out and all I can find is HTML, CSS and JavaScript. Are you sure it's Java and not JavaScript you're refering to? (Although the some of the names suggest, that you're right and it is actually Java.)

Now, it would be great to know what type of code you can use for your second page (e.g. which language(s)) and what the length-limit is. Without knowing the tools, we won't be able to help you, I guess.

Oh, and why can't you use frames? I'm sure there's a good reason, but knowing the reason might help too.

Greetings,
Nepomuk

[bekdavis]

this is the script i used to make the page: http://sorgalla.com/jcarousel/

Honestly, I am not sure what type of code I am allowed to use. I can tell you that there is another "replicatin g site" that has inserted the following code

<link href="http://www.XXXXX.com/cart/stylesheet.css" type="text/css" rel="stylesheet" /></p>
<!--[if IE]><link type="text/css" rel="stylesheet" href="http://www.XXXXX.com/cart/ie.css" /><![endif]--><script type="text/javascript">
	document.write('<script type="text/javascript" src="http://XXXXXX.com/cart/store-renderer.php"><\/script>');
</script>

Frames: I need for my page to flow as if it were part of the replicating website page.

here is an example of what I am talking about. I don't want to link directy to it. You know where to place the DOTS.
www scentsy com/alice

[Nepomuk]

OK, after checking that page I'm pretty sure, we're talking about JavaScript and maybe some Ajax, so I'm moving this thread to the JavaScript / Ajax Forum. I'm sure, our experts there will be willing and able to help you.

I can however think of one more question: Do you have the possibility to upload files (e.g. .js files) somewhere to one of those servers? If so, that could probably make life a lot easier.

Anyway, I'll let our JavaScript / Ajax Experts do their work from here on.

Greetings,
Nepomuk

[bekdavis]

Thanks so much!!!

No, I am not able to upload any files to the replicating website. I can however upload files to the bekdavis.com website. ;)

[bekdavis]

any idea anyone? I would appreciate any ideas you may have.

Thanks in advance.

bek

[ivosilva]

Hi, bekdavis!

As I mentioned on my first reply you can use Ajax. Here's a solution you could use:

1. Add this code to http://www.scentsy.com/diane:

<div id="bekdavis"></div>
<script type="text/javascript" src="http://www.bekdavis.com/jcarousel/examples2/include.js"></script>

2. The include.js file looks like this:

function includePage(url, placeHolderId) {

	var xmlhttp = false;
	
	/*@cc_on @*/
	/*@if (@_jscript_version >= 5)
	// JScript gives us Conditional compilation, we can cope with old IE versions.
	// and security blocked creation of the objects.
	 try {
	  xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	 } catch (e) {
	  try {
	   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
	  } catch (E) {
	   xmlhttp = false;
	  }
	 }
	@end @*/
	
	if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
		try {
			xmlhttp = new XMLHttpRequest();
		} catch (e) {
			xmlhttp=false;
		}
	}
	
	if (!xmlhttp && window.createRequest) {
		try {
			xmlhttp = window.createRequest();
		} catch (e) {
			xmlhttp=false;
		}
	}
	
	xmlhttp.open("GET", url,true);
		xmlhttp.onreadystatechange=function() {
		if (xmlhttp.readyState==4) {
			document.getElementById(placeHolderId).innerHTML = xmlhttp.responseText;
		}
	}
	
	xmlhttp.send(null);
}

includePage("http://www.bekdavis.com/jcarousel/examples2/diane.html", "bekdavis");

Additional notes:

- Your include page will have images, links, ... if you include it as is, without any change it simply won't work. Full URL for images and links must be supplied and every link should be specially crafted to use Ajax, otherwise when users click a link it will be either invalid or will redirect them to another page.

- This is one possible solution to your problem given the restrictions you imposed but, as Nepomuk stated an iframe should do the job just fine, even if the user has to scroll it would spare you a lot of development time.

Best regards!

[bekdavis]

Thanks for your reply. I have tested the code here: http://www.bekdavis.com/code.html and I am having problems. The scrollinig images are not displaying as on the original page: http://www.bekdavis.com/jcarousel/examples2/diane.html

What am I doing wrong? I really do appreciate your help & don't mean ot be a pain in the butt. ;)

[ivosilva]

Hello, bekdavis!

I was checking out my code and making some tests and realized that it was first tested in the same domain which is not what you want.

The problem you are having is related to carousel not being initialized (since the Javascript code and includes of the included page are not evaluated). You would also have to include the jquery.js and carousel.js in the page and initialize the carousel after setting the innerHTML of the place holder.

Anyway, as I was saying, that code will only work when you are in the same domain since Ajax is not allowed to make cross-domain calls. My bad :(

I guess you really have to go with the iframe.

Best regards!