Welcome Guest.   Make a donation to an author on the site November 28, 2014, 09:55:55 AM  *

Please login or register.
Or did you miss your validation email?


Login with username and password (forgot your password?)
Why not become a lifetime supporting member of the site with a one-time donation of any amount? Your donation entitles you to a ton of additional benefits, including access to exclusive discounts and downloads, the ability to enter monthly free software drawings, and a single non-expiring license key for all of our programs.


You must sign up here before you can post and access some areas of the site. Registration is totally free and confidential.
 
Learn about the DonationCoder.com microdonation system (DonationCredits).
   
   Forum Home   Thread Marks Chat! Downloads Search Login Register  
Pages: [1] 2 Next   Go Down
  Reply  |  New Topic  |  Print  
Author Topic: Learnin Javascript  (Read 9789 times)
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« on: August 10, 2007, 02:05:56 PM »

Can someone recommend a good SIMPLE TO UNDERSTAND book to help me learn Javascript ?

Lew
Logged

Lew
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #1 on: August 11, 2007, 05:25:41 AM »

This is something that comes up at least ten times every month or so in the newsgroup comp.lang.javascript.  I'll refer you to that FAQ for now.

http://jibbering.com/faq/#FAQ3_1

I'll say this about David Flanagan's book though.  I've read the 3rd edition and am currently reading the 5th.  It is simple enough to understand, but bounces back and forth in my opinion.  Also, it doesn't discuss advanced topics at all.  Or at least, nothing you couldn't find on a fairly decent resource site.

I would recommend it for an absolute beginner though.  I'll say this as well, download the errata and pay attention when something doesn't go right.  It's most likely a typo in the book.

If using Internet Explorer, I recommend Microsoft Script Editor.
If using Firefox, I recommend Firebug.

Also, Venkman might be a wise addition to your arsenal.

Depending on your level of expertise and understanding of technical documents you could view the latest revision of the ECMAScript revision or better yet, ISO/IEC 16262, which is basically the updated ECMAScript.

Also, an indispensable resource for JavaScript is the Mozilla Gecko pages at:

http://developer.mozilla.org/

I listed the root site so you could see all of the available technologies and areas of interest.  Merely click JavaScript if that is your only interest and you're off.  Oh, and a JavaScript programmer *must* be aware of the DOM.  So I'd suggest delving into the DOM category as well.

Good luck!
Logged

I code.  Therefore I am.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #2 on: August 11, 2007, 07:52:55 AM »




Absolute beginner -  that's me.

Thank you very much.  You gave me a lot of information.  I'll head out for Barnes & Noble.


Lew
Logged

Lew
nontroppo
Charter Honorary Member
***
Posts: 648


spinning top

View Profile WWW Give some DonationCredits to this forum member
« Reply #3 on: August 11, 2007, 01:25:24 PM »

I used these online tutorials to learn the basics:

http://www.howtocreate.co.uk/tutorials/javascript/
http://www.croczilla.com/...vascript_guide/index.html

and this to understand more:

http://simon.incutio.com/...reintroduction-notes.html

Though without knowing a bit of HTML, understanding the DOM will be tough, so you may want to make sure you know the basics there too...
Logged

ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #4 on: August 11, 2007, 07:28:51 PM »

I know nothing.  I want to learn.  I am trying to use an image as a background in a program that is on my HD
( Not a web page )  I get the image OK but it appears  split.  The  left portion of the image and then  the image again.   See screenshot.  Note the BLUE line and the repeat of the image .

I been trying to solve this for a week.  I figured a good SIMPLE book would do the trick.  Between all this info I should be able to work this out.

Lew


* ScreenShot032.png (1193.58 KB, 1023x513 - viewed 243 times.)
Logged

Lew
mouser
First Author
Administrator
*****
Posts: 33,705



see users location on a map View Profile WWW Read user's biography. Give some DonationCredits to this forum member
« Reply #5 on: August 12, 2007, 09:20:29 AM »

You know it might be nice to collect lists of the best learning resources for each language to put in our programming school sections: http://www.donationcoder....orum/index.php?board=77.0

If anyone wants to take on that project it would be welcome.
Logged
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #6 on: August 17, 2007, 01:52:42 AM »

What are the specifics?  Just, "I think Site A rocks for Language X?"

I am currently working on some reviews for App (app103), but I'd be more than willing to share what resources I use for various languages.
Logged

I code.  Therefore I am.
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #7 on: August 17, 2007, 01:55:26 AM »

I know nothing.  I want to learn.  I am trying to use an image as a background in a program that is on my HD
( Not a web page )  I get the image OK but it appears  split.  The  left portion of the image and then  the image again.   See screenshot.  Note the BLUE line and the repeat of the image .

I been trying to solve this for a week.  I figured a good SIMPLE book would do the trick.  Between all this info I should be able to work this out.

Um... so are we talking JavaScript still, or no?  If so, what type of environment are you running JavaScript in if not a Web browser?

EDIT:  I didn't mean that to sound as if there are no other possible means to run JavaScript except for in a browser.  I just meant what are you using to run your JavaScript then? 
Logged

I code.  Therefore I am.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #8 on: August 17, 2007, 08:58:22 AM »

The program ( NirSoft > SeqDownload ) downloads the radar sweeps from NOAA to my HD.  At some point I run the  animation  program ( part of SeqDownload)  It  " animates" the radar sweeps one at a time every X milliseconds.
You are correct in that is does open up my browser  ( Firefox )to show the animation and the background file that I  have added.  I have the file but for some reason it splits ( see my earlier post  blue line )  and so the radar scan is not accurately placed.    I ordered Flanagan's Book from Amazon. Should arrive any day.

Lew
Logged

Lew
AbteriX
Charter Honorary Member
***
Posts: 1,053


Member #520

see users location on a map View Profile WWW Read user's biography. Give some DonationCredits to this forum member
« Reply #9 on: August 17, 2007, 10:10:08 AM »

@fowmow
You can use JS to code for WSH (Windows Scripting Host).
You can use it directly to do smtg with your files on disk
or use it e.g. in an text editor like PSPad to extend the editor functionality-

@ljbirns
Did you create the HTML file yourself?
It seams as you have put the image in the body tag
like
<BODY BACKGROUND="some.gif">
Than it's normal that the browser tile the image a few times till the browser window is full.

Use  <IMG SRC="some.gif">
instead between <BODY  > and </BODY>
Logged

Greetings, Stefan.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #10 on: August 17, 2007, 06:09:46 PM »

<IMG SRC=>  was my original choice.  It does put the image into the program but it puts it
not as background but almost as a separate page.

If A is the IMG  and B is the animated radar sweeps IMG SCR gives me      A
                                                                                                    B 

Background gives me      A/B   ( B is superimposed on A ) which is what I want but A  background is not correctly positioned.  I hope I am making myself clear.  This is not a serious problem.  I would like it to work and figured I could learn something at the same time.  Hence i bought the book.

Lew
Logged

Lew
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #11 on: August 17, 2007, 08:15:50 PM »

@fowmow
You can use JS to code for WSH (Windows Scripting Host).
You can use it directly to do smtg with your files on disk
or use it e.g. in an text editor like PSPad to extend the editor functionality-

I'm not sure what gave you the impression I didn't know this already.  Thanks for trying to help though.
Logged

I code.  Therefore I am.
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #12 on: August 17, 2007, 08:25:27 PM »

The program ( NirSoft > SeqDownload ) downloads the radar sweeps from NOAA to my HD.  At some point I run the  animation  program ( part of SeqDownload)  It  " animates" the radar sweeps one at a time every X milliseconds.
You are correct in that is does open up my browser  ( Firefox )to show the animation and the background file that I  have added.  I have the file but for some reason it splits ( see my earlier post  blue line )  and so the radar scan is not accurately placed.    I ordered Flanagan's Book from Amazon. Should arrive any day.

Whilst SeqDownload does provide the option for "JavaScript animation" it may not be the problem.  Or rather, JavaScript may not be the problem.

I don't suppose it is possible for you to post an example of this anomaly online is there?

Or perhaps give me the link to whatever scans you are retrieving, I'll download SeqDownload and try it myself to see if I can reproduce your problem.
Logged

I code.  Therefore I am.
AbteriX
Charter Honorary Member
***
Posts: 1,053


Member #520

see users location on a map View Profile WWW Read user's biography. Give some DonationCredits to this forum member
« Reply #13 on: August 18, 2007, 04:21:50 AM »

I'm not sure what gave you the impression I didn't know this already.  Thanks for trying to help though.

 Grin   Sorry, i have understand your question wrong:
Quote from: fowmow
I just meant what are you using to run your JavaScript then?
Logged

Greetings, Stefan.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #14 on: August 18, 2007, 09:41:41 AM »

I have attached two screen shots.  What I GET thumb down    and    what I WANT thumbs up
Here is the URL that I download from .  http://radar.weather.gov/...adarImg/N0R/OKX_N0R_0.gif
Here is the NirSoft SeqDownload   website    http://www.nirsoft.net/utils/seqdownload.html
To be honest everything I read just confuses me more and more.

This is the  JavaScript: from NirSoft  MY ADDITION is   BODY BACKGROUND etc

html>
<head>
<title>Image Map Example</title>
<script LANGUAGE="JavaScript" type="text/javascript">
function update(t) {
   document.form1.text1.value = t;
}


</script>
</head>
<body>

html>
<head>
<title>Image Map Example</title>
<script LANGUAGE="JavaScript" type="text/javascript">
function update(t) {
document.form1.text1.value = t;
}
</script>
</head>
<BODY BACKGROUND ="file://C:/Documents and Settings/Owner/Desktop/mappics/110.png"

</body>
 </SCRIPT>


Created By using <a href="http://www.nirsoft.net/utils/seqdownload.html" target="nirsoft">SeqDownload[/url]



<!--***NIRSOFT_CODE***-->


<script language="javascript">
var imageIndex = 0;
var timeoutID = 0;
var playMode = 1;


function animImageInc()
{
if (imageIndex < numOfImages)
   imageIndex++
else
   imageIndex = 1;
}

function animImageDec()
{
if (imageIndex > 1)
   imageIndex--;
else
   imageIndex = numOfImages;
}

function setCurrImage()
{
   document.MainImage.src = imgarray[

imageIndex].src;
}

function updateAnim()
{
   var currTimeoutValue;
   
   currTimeoutValue = timeoutValue;

   if (playMode == 1)
   {
      animImageInc();
      if (imageIndex == numOfImages)
         currTimeoutValue += animDelay;
   }
   else
   {
      animImageDec();
      if (imageIndex == 1)
         currTimeoutValue += animDelay;
   }
   setCurrImage();
   timeoutID = setTimeout("updateAnim()", currTimeoutValue);
}

function clearLastUpdate()
{
   clearTimeout(timeoutID);
   timeoutID = 0;
}

function startPlay()
{
   clearLastUpdate();
   playMode = 1;
   updateAnim();   
}

function startPlayReverse()
{
   clearLastUpdate();
   playMode = 2;
   updateAnim();   
}


updateAnim();

</script>

<form name="PlayForm">
<table>
<tr>
<td><input type="button" onclick="startPlay()" value="Play >>">
<td><input type="button" onclick="startPlayReverse()" value="Play <<">
<td><input type="button" onclick="clearLastUpdate()" value="Stop">
<td><input type="button" onclick="animImageInc();setCurrImage()" value=">>">
<td><input type="button" onclick="animImageDec();setCurrImage()" value="<<">
<td><input type="button" onclick="timeoutValue = parseInt(document.PlayForm.IntervalValue.value)" value="Change Interval >>">

<td><input type="text" name="IntervalValue">
</table>
</form>

<script language="javascript">
document.PlayForm.IntervalValue.value = timeoutValue;
</script>


</body>

</html>



* What I Get.png (1338.99 KB, 1024x562 - viewed 335 times.)

* What I WANT.png (1109.57 KB, 941x768 - viewed 357 times.)
Logged

Lew
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #15 on: August 18, 2007, 02:14:20 PM »

I have tried adding the following ( one at a time ) to the script without results.

A)   <body style="background-attachment: fixed; background-repeat: no-repeat;" background=          "file://C:/Documents and Settings/Owner/Desktop/mappics/110.png"

B)    <background="fixed">

C)    <bg properites="fixed">

D)   <body background="file://C:/Documents and Settings/Owner/Desktop/mappics/110.png"       behavior="fixed">


E)   <body style="background-attachment: fixed; background-repeat:no-repeat;
     background="file://C:/Documents and Settings/Owner/Desktop/mappics/110.png">

Lew
Logged

Lew
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #16 on: August 20, 2007, 04:36:12 PM »

There are far too many things wrong with the markup and code you provided.  Is it at all possible for you to upload this example somewhere?

A few notes:

1.  That link you gave for the images, leads to only 1 image.  And it didn't appear to update...

2.  Setting one image as your background does not seem to be the primary way SeqDownload animates images.  Although it can be done.

3.  The "language" attribute is deprecated in favor of using:

type="text/javascript"

Although some would argue that it too is deprecated.

4.  The things you've tried (directly above this post) are all methods of styling the document via HTML attributes.  This should arguably be done via CSS.

However, I do not think it is the source of your problems.

Anything further, I'd really need to see an example page, complete with images and code.
Logged

I code.  Therefore I am.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #17 on: August 20, 2007, 07:13:15 PM »

There are far too many things wrong with the markup and code you provided.  Is it at all possible for you to upload this example somewhere?

A few notes:

1.  That link you gave for the images, leads to only 1 image.  And it didn't appear to update...

2.  Setting one image as your background does not seem to be the primary way SeqDownload animates images.  Although it can be done.

3.  The "language" attribute is deprecated in favor of using:

type="text/javascript"

Although some would argue that it too is deprecated.

4.  The things you've tried (directly above this post) are all methods of styling the document via HTML attributes.  This should arguably be done via CSS.

However, I do not think it is the source of your problems.

Anything further, I'd really need to see an example page, complete with images and code.

1) The link was ONE image from this site: > http://radar.weather.gov/...rlay=11101111&loop=no
I am downloading ONLY the radar scan without any background.

The radar image changes each time you visit the site.  Use the  LOOP feature to see the effect
The site only gives T  number of images in the loop phase. 
SeqDownload will give me 100 x T images making for a much more accurate time frame of the storm activity.
2) SeqDownload does NOT animate the background. It animates the images ( as in # 1 above )
I am looking for the animated images to be superimposed on a static background.

3) 3 and 4 of your reply is beyond my knowledge or understanding. ( Whatever coding I added
was modified from a book on JavaScript and various googled websites. Seemed  a good  at the time.
As for images and code I put the code  ( SeqDownload ) in my reply # 14 above.

In my post above  (my # 14 )I show the image I am getting. As you can see it is  for some reason tiled. Is there a way to  " un-tile " it ?

My ignorance  to even understand most of what you are saying is , of course, a hinderence to your helping me.  I appreciate all you are doing to help .

Thanks
Lew
Logged

Lew
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #18 on: August 20, 2007, 08:02:25 PM »

Alright.  I *am* going to get you sorted.  Please paste for me a screenshot of SeqDownloader's "Download Properties" dialog.  The one where you insert a new item.

I want to see your *exact* settings, and the *exact* URL you download from.  I used the revised URL you provided in your last post and was getting PHP files.

So, help me help you... once I figure out this downloading of images part, the rest is easy!
Logged

I code.  Therefore I am.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #19 on: August 21, 2007, 08:41:52 AM »

I think I screwed up with the revised URL.  Attached are screenshots of SeqDownload  dialogs.

The first one  # 36 shows the URL from which I download. The folder is where the downloaded GIF is stored. Last download
file is the name automatically given that file.  I have it set to download a new  file every 5 minutes.

The second one # 37 shows the annimation screen. Images folder is where the images reside on my computer.
The HTML template is the SeqDownload animation file to which I ADDED the BODY BACKGROUND line as below:

<html>
<head>
<title>Image Map Example</title>
<script LANGUAGE="JavaScript" type="text/javascript">
function update(t) {
   document.form1.text1.value = t;
}

</script>
</head>
<body>


html>
<head>
<title>Image Map Example</title>
<script LANGUAGE="JavaScript" type="text/javascript">
function update(t) {
document.form1.text1.value = t;
}
</script>

<BODY BACKGROUND ="file://C:/Documents and Settings/Owner/Desktop/mappics/110.png">

<background="fixed">

{

</style>
             

</SCRIPT>

  Created By using <a href="http://www.nirsoft.net/utils/seqdownload.html" target="nirsoft">SeqDownload[/url]



<!--***NIRSOFT_CODE***-->


<script language="javascript">
var imageIndex = 0;
var timeoutID = 0;
var playMode = 1;


function animImageInc()
{
if (imageIndex < numOfImages)
   imageIndex++
else
   imageIndex = 1;
}

function animImageDec()
{
if (imageIndex > 1)
   imageIndex--;
else
   imageIndex = numOfImages;
}

function setCurrImage()
{
   document.MainImage.src = imgarray[

imageIndex].src;
}

function updateAnim()
{
   var currTimeoutValue;
   
   currTimeoutValue = timeoutValue;

   if (playMode == 1)
   {
      animImageInc();
      if (imageIndex == numOfImages)
         currTimeoutValue += animDelay;
   }
   else
   {
      animImageDec();
      if (imageIndex == 1)
         currTimeoutValue += animDelay;
   }
   setCurrImage();
   timeoutID = setTimeout("updateAnim()", currTimeoutValue);
}

function clearLastUpdate()
{
   clearTimeout(timeoutID);
   timeoutID = 0;
}

function startPlay()
{
   clearLastUpdate();
   playMode = 1;
   updateAnim();   
}

function startPlayReverse()
{
   clearLastUpdate();
   playMode = 2;
   updateAnim();   
}


updateAnim();

</script>

<form name="PlayForm">
<table>
<tr>
<td><input type="button" onclick="startPlay()" value="Play >>">
<td><input type="button" onclick="startPlayReverse()" value="Play <<">
<td><input type="button" onclick="clearLastUpdate()" value="Stop">
<td><input type="button" onclick="animImageInc();setCurrImage()" value=">>">
<td><input type="button" onclick="animImageDec();setCurrImage()" value="<<">
<td><input type="button" onclick="timeoutValue = parseInt(document.PlayForm.IntervalValue.value)" value="Change Interval >>">

<td><input type="text" name="IntervalValue">
</table>
</form>

<script language="javascript">
document.PlayForm.IntervalValue.value = timeoutValue;
</script>
</body>

If you don't check the template box you get the radar images WITHOUT any background.

Lew



* ScreenShot036.png (123.23 KB, 1024x316 - viewed 236 times.)

* ScreenShot037.png (271.51 KB, 967x767 - viewed 288 times.)
Logged

Lew
sri
Honorary Member
**
Posts: 673


see users location on a map View Profile WWW Read user's biography. Give some DonationCredits to this forum member
« Reply #20 on: August 21, 2007, 09:40:35 AM »

http://www.exforsys.com/tutorials/javascript.html
Logged

fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #21 on: August 22, 2007, 08:57:39 AM »

Alright ljbirns, is this along the lines of what you wanted to see?

Logged

I code.  Therefore I am.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #22 on: August 22, 2007, 10:59:51 AM »

WOW !!!  Exactly what I want to see.  Please show me how.

Thank you.

Lew
Logged

Lew
fowmow
Charter Member
***
Posts: 46


View Profile Give some DonationCredits to this forum member
« Reply #23 on: August 22, 2007, 04:30:31 PM »

Exactly what I originally thought.  Your problem was not JavaScript at all.  It was a CSS issue.  Well, technically a CSS issue.

The source that SeqDownload creates for you starts out something like this:

Formatted for CSS with the GeSHI Syntax Highlighter [copy or print]
  1. <style type="text/css">
  2. body, input {
  3. font-weight: normal;
  4. font-size: 12px;
  5. font-family:  Verdana, Arial, Helvetica;
  6. }
  7. </style>

All you have to do is add this, *directly* after that.

Formatted for CSS with the GeSHI Syntax Highlighter [copy or print]
  1. body
  2. {
  3. background-image: url("OKX_Topo_Short.jpg");
  4. background-repeat: no-repeat;
  5. }

I'll leave it up to you to get that image.  Hint.
« Last Edit: August 22, 2007, 04:33:26 PM by fowmow » Logged

I code.  Therefore I am.
ljbirns
Charter Member
***
Posts: 229


see users location on a map View Profile Give some DonationCredits to this forum member
« Reply #24 on: August 23, 2007, 01:44:38 PM »

fowmow

Terriffc !!  I really thank you.  You did all the work. I truly don't understand  the difference between Javascript and CSS. Flanagan's book came.. I'm beginnig to think he might as well have written it in Greek.  But since I am retired now I have plenty of time to see what I can learn.
 I tried to use a  GIF file that is on my HD instead of the URL. I changed URL(" xx")  to
   file("c:\map.gif");    as in # 3 above . It did not work. Is the syntax for files different than URL's ?  At any rate I do thank you for all the time and effort. This website and forum has
great people on it.

regards

Lew





Logged

Lew
Pages: [1] 2 Next   Go Up
  Reply  |  New Topic  |  Print  
 
Jump to:  
   Forum Home   Thread Marks Chat! Downloads Search Login Register  

DonationCoder.com | About Us
DonationCoder.com Forum | Powered by SMF
[ Page time: 0.121s | Server load: 0.27 ]