JavaScript - Loading File From Disk

Hi,

I'm currently working on my portfolio website and would like to have information about my movie clips be retrieved from an XML document when a thumbnail is clicked. I am building my website in HTML and would like to retrieve the Xml using JavaScript. Any help would be appreciated.

My XML is valid and structured as such:


<?xml version="1.0" encoding="UTF-8"?>
<work>

<motion>

<reel>
<title id="Demo Reel 2009" project="Self Promotion" client="Self">
<![CDATA[This demo reel is primaraly a collection ......]]>
</title>
</reel>
.
.
.
.


These are my initial variable definitions and readXML function in javascript:


<script language="javascript">

var xmldom, workNode, motionNode, printNode, fineartNode, displayNode, titleNode;


function readXMLDocument()
{

xmldom=createDocument();
xmldom.async=false;


if (xmldom.parseError != 0) {
alert("An error occurred: \nError Code " + xmldom.parseError.errorCode + "\n" + "Line: " + xmldom.parseError.line + "\n" + "Line Pos: " + xmldom.parseError.linepos + "\n" + "Reason: " + xmldom.parseError.reason);
} else {
alert("Document: " + xmldom.documentElement);
alert("Root: " + xmldom.documentElement.tagName);
alert("Child: " + xmldom.documentElement.firstChild.tagName);
alert("Xml DOM: " + xmldom.xml);
}


xmldom.load("workinfo.xml");


workNode=xmldom.documentElement;

motionNode=workNode.firstChild;

printNode=motionNode.nextSibling;

fineartNode=printNode.nextSibling;
}
.
.
.
.



A call to function revealText is called "onClick" of a thumbnail as such:


<a href="videopages/reel.html" class="vid" target="video" onClick="revealText(0)">


This is function revealText:


function revealText(x)
{
var title, project, client, info;

readXMLDocument();

displayNode=motionNode.childNode[x];


titleNode=displayNode.firstChild;


title=titleNode.getAttribute("id");
project=titleNode.getAttribute("project");
client=titleNode.getAttribute("client");
info=titleNode.getNodeValue();

titleSpan.innerHTML=title;
projectSpan.innerHTML=project;
clientSpan.innerHTML=client;
infoSpan.innerHTML=info;
}
</script>

and these are the spans they are written to:


<span id="titleSpan" class="vidinfo">

<span id="projectSpan" class="vidinfo">

<span id="clientSpan" class="vidinfo">

<p id="infoSpan" class="content">


If you have read this far, I REALLLLY appreciate it. And any ideas as to what is wrong would help alot.

Hi,

I have some code that performs differently in Opera than it does in any other browser. So I have a stylesheet specifically for opera. Is there a way to do something like this, where I check the browser, and if it's not opera, then load the default sheet, otherwise load the opera-specific css?

Code:

<script>
 // Browser Detection Javascript
// copyright 1 February 2003, by Stephen Chapman, Felgall Pty Ltd

// You have permission to copy and use this javascript provided that
// the content of the script is not changed in any way.

function whichBrowser() {
var agt=navigator.userAgent.toLowerCase();
if (agt.indexOf("opera") != -1) return 'Opera';
if (agt.indexOf("staroffice") != -1) return 'Star Office';
if (agt.indexOf("webtv") != -1) return 'WebTV';
if (agt.indexOf("beonex") != -1) return 'Beonex';
if (agt.indexOf("chimera") != -1) return 'Chimera';
if (agt.indexOf("netpositive") != -1) return 'NetPositive';
if (agt.indexOf("phoenix") != -1) return 'Phoenix';
if (agt.indexOf("firefox") != -1) return 'Firefox';
if (agt.indexOf("safari") != -1) return 'Safari';
if (agt.indexOf("skipstone") != -1) return 'SkipStone';
if (agt.indexOf("msie") != -1) return 'Internet Explorer';
if (agt.indexOf("netscape") != -1) return 'Netscape';
if (agt.indexOf("mozilla/5.0") != -1) return 'Mozilla';
if (agt.indexOf('\/') != -1) {
if (agt.substr(0,agt.indexOf('\/')) != 'mozilla') {
return navigator.userAgent.substr(0,agt.indexOf('\/'));}
else return 'Netscape';} else if (agt.indexOf(' ') != -1)
return navigator.userAgent.substr(0,agt.indexOf(' '));
else return navigator.userAgent;
}
 
if(whichBrowser() != 'Opera')
{
	<link type="text/css" href="jquery-ui-1.8.13.custom/css/custom-theme/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
}
else
{
	<link type="text/css" href="jquery-ui-1.8.13.custom/css/custom-theme/jquery-ui-1.8.13.custom.OPERA.css" rel="stylesheet" />
}
</script>

As of this writing, that code seems to break my page, as if it doesn't like loading a sheet based on an if/else clause.

im trying to onclick function on the button but in firebug it will say, function not defined, i even tried to do it with a internal script, but still it will not work. please help


Code:

<!DOCTYPE html>
<html>
  <head>
<script type="text/javascript" src="s/i.js">

</script>
  </head>
    <body> 
	
	 <button id="fihkhjsdk" onclick="ff();"> dsfh </button>
<php code...>
</body>

</html>

How to detect if the user clicked cancel while uploading a file ? Is there an event for it?

So,

I have to rely on a third party external JS file to load into a site of mine. Problem is I have to have it (for ads), but once every blue moon the server fails to repond to the request (its down or unresponsive), and thus because the JS can't load, the site hangs.

Is there a reliable js/ajax etc.. mechanism that I can use to set an allotted time and if the js isn't loaded, cancel the call or stop it so the page can load?

Please advise.

Caveats: I cannot host it, I cannot use php. Basically I was given a script call and I include it in the header of the page. I don't have alot of room to host, use various technologies etc.. other than what I am able to use without any backend/app scripting.

Hello all,

I have the following code to load a new html page into the 'new content' div once the user scrolls to the bottom of the page.

It all works fine. No problems, except I would like it to pause for a moment whilst it is loading, and show a loading box div at the bottom of the screen as it loads the new content, just to give some positive feedback for the user.

So the new div would sit in a fixed position at 'bottom:0px;' and have a loading image inside it.

Is this easy to do? I am new to javascript so bear with me

Code:

alreadyloading = false;
nextpage = 2;
 
$(window).scroll(function() {
    if($(window).scrollTop() + $(window).height() == $(document).height()) {
        if (alreadyloading == false) {
            var url = "page"+nextpage+".html";
            alreadyloading = true;
            $.post(url, function(data) {
                $('#newcontent').children().last().after(data);
                alreadyloading = false;
                nextpage++;
            });
        }
    }
});

The 'new content' is a div which is at the bottom of the page and is where the new content loads to!

Thank you very much

Hi there,

Firstly my title may be a bit misleading as I don't i'm not sure how to do it. My situation is that I have a small piece of javascript that 'cycles' through a bunch of URL's (the URL's are reports produced by SSRS). The problem is that each time the javascript loads a new URL it has to generate the report, so I have a few seconds where the screen says 'Generating Report'.

What I would like is a system that never displays the Generating Report, instead I would like to maybe pre-load the next report so it is ready to show instantly.

Does anyone have any idea how to do this? Any help would be greatly appreciated.

Cheers,

Tom.

Hi everyone,

I am having trouble getting a loading bar to appear from my javascript.

I have the following code in place

Code:

$(document).ready(function(){
 $(window).scroll(function(){

  var h = $('#footer').height();
  var y = $(window).scrollTop();
  if( y > (h*0) && y < (h*1.0) ){

	  $('#loading').fadeIn("slow");
	   $('#loading').delay(10000).fadeOut();

   $("#portfolios").delay(1000).fadeIn("slow");
  
  }
 });
})

I have it so when the user reacher the 'footer' div of the page, new posts appear which are contained in the 'portfolios' container div. They appear fine but no loading bar appears...

The loading bar 'gif' is in the 'loading div id'.

There is a 'display:none;' in the css on the loading div and the portfolios div.

Any reason why the 'loading' div doesn't display but the portfolios does?

I want the loading gif to show whilst the 'portfolios' is loading basically when the user hits the bottom of the page.

Any help would be appreciated!

Thank you!

I'm not sure where to put this question. I'mworking with something called OSClass which is a classified section php program. It has a plugin to make payments to paypal. but I need it to work in a new window, and the link won't do so. Don't suppose anybody sees an issue here? It seems to me that just adding target=_new to this would work. but it doesn't. Still opens the page in the same window.


Code:

<div class="buttons">
              <div class="right"><a id="button-confirm" class="button" onclick="$('#payment_<?php echo $r; ?>').submit();" target="_new"><span><img src='<?php echo paypal_path(); ?>paypal.gif' border='0' /></span></a></div>
            </div>

I have nearly successfully implemented a gallery using Backbox:
http://www.javascriptkit.com/script/...ox/index.shtml

However, when I test it in IE (7 & 8), it looks like it's invoking the javascripts and loading the large image from the thumbnail link, but then it just hangs up on the loading waiting to get the image. Does anyone know how to fix this? Thanks.

Can someone please show me a working example of how to load a WebPage from an existing WebPage using Javascript! I have tried googling the syntax and not having any luck.

Thanks,

Blake

is there a way to after thye page load add an image. So maby loading it in the background and just showing it when you click a button?

Is there a way to load up an external JS file outside of the head tag? I've got an "AJAX" web app that's loading several pages simply by changing the innerHTML property of a single div. The JS source is getting to be rather large, so I'd like to split it up into manageable, organized portions. Is there some way to, using javascript or PHP, load another javascript into the browser dynamically?

for some reason I can't get this code to load...

Code:

<script type="text/javascript">

alert("test");
windowBody = document.getElementById("windowBody");
windowBody.style.height = (frameHeight - 250) + "px";

</script>

that should load when it loads the file foot.php

foot.php should be included onto the bottom of all of my labs (and it is)

my labs are opened up with Ajax...

but the script its not loading at all...

someone help =[

the web site is
http://opentech.durhamcollege.ca/~in...rittains/labs/

sorry for the poor description I'm having a hard time describing this error lol

Right,

I've been searching for a few days now and i'm looking for a AJAX/JQuery script where i can load external content in to a div.

I've seen a few site's that have it, and im after it so when i click the page link it loads it in the address bar like this
http://www.google.co.uk/#content/index.php

or what ever.

Thanks.