JavaScript - Moving Objects With Acceleration

Hi

If i was using c# i would use a generic list and add all my people objects to the list collection

but how do i do this in jquery/javascript


eg

//container object
var allObj= {

};

//people object
var people= {
name:"fred",:
age:00;
};

How do I add many people objects to allObj (the amount of people added in not always the same)
eg the final result is something like this

allObj
-person1
-person2
-person3
-person4


thanks

Hi there,
I have a very strange issue using dynamic scripting and iframe. It looks like when when iframe is loaded (i.e. onload method is triggered) all js objects that were sent to iframe before disappear? To clarify... I set iframe.scr from java script that caused it to connect to the server. After connection is established I start sending JS code to it (including some JS objects). At some point connection to iframe is closed (and onload method is called). Later on I reconnect (i.e. set src property again), and try to issue method calls on the JS objects that were sent in earlier session. None of these methods get triggered. Did anyone experienced similar problems? Is there a workaround? (I.e. is there any way I can send register JS Objects globally when sent through iframe?).

Thanks for all your help,

Ed

Hi All

I thought it was about time to actually learn Javascript rather than pretend I know it, so I'm new to Javascript.

I've been reading Javascript 'The Good Parts' and have watched a few google videos on Youtube.

So I came across prototyping which seems to be quite fundamental to JS but is quite awkward to use. I am trying to avoid the use of the 'new' keyword and limit my application to one Global variable, as this can improve the JS scripts performance, reliability and security.

In essence I'm just trying to make a simple MsgBox object that has a method called 'alertMe', which in turn simply shows an alert box with 'Hello'

If this is not very clear then say so as trying to explain something you don't fully understand is quite hard.

Here's my code, doesn't alert when I called the object.
Have a look


Code:

var MyLib = {};
MyLib.MsgBox = function(){
	
			//Object methods
			MyLib.MsgBox.prototype.alertMe = function(){
				alert('Hello');
			};

};

MyLib.MsgBox.alertMe();

Any help and pointers will be very appreciated.
Regards, Magnetica

Hello everybody am a JavaScript beginner.

here is a code making rollovers
////////////////////////////////////////////////
window.onload=rolloverInit;

function rolloverInit()
{
for(var i=0; i<document.images.length; i++)
{
if(document.images.parentNode.tagName=="A")
{
setUpRollover(document.images);
}
}
}

function setUpRollover(currentImage)
{
currentImage.outImage = new Image();
currentImage.outImage.src = currentImage.src;
currentImage.onmouseout = rollOut;

currentImage.overImage = new Image();
var source = currentImage.src;
var sourceText = source.toString();
if(sourceText.indexOf("png")>0)
{
currentImage.overImage.src ="images/"+currentImage.id+"_on.png";
}
else
{
currentImage.overImage.src ="images/"+currentImage.id+"_on.gif";
}


/*currentImage.overImage.src ="images/"+currentImage.id+"_on.gif";*/
/*currentImage.overImage.src ="images/"+currentImage.id+"_on.png";*/
currentImage.onmouseover = rollOver;



currentImage.clickImage = new Image();
if(sourceText.indexOf("png")>0)
{
currentImage.clickImage.src ="images/"+currentImage.id+"_click.png";
}
else
{
currentImage.clickImage.src ="images/"+currentImage.id+"_on.gif";
}
/*currentImage.clickImage.src = "images/"+currentImage.id+"_on.gif";*/
/*currentImage.clickImage.src = "images/"+currentImage.id+"_on.png";*/
currentImage.onmousedown = rollClick;



currentImage.parentNode.childImage = currentImage;
currentImage.parentNode.onblur = rollOutParent;
currentImage.parentNode.onfocus = rollOverParent;

}

function rollOut()
{
this.src = this.outImage.src;
}

function rollOver()
{
this.src = this.overImage.src;
}

function rollClick()
{
this.src = this.clickImage.src;
}


function rollOutParent()
{
this.childImage.src = this.childImage.outImage.src;
}

function rollOverParent()
{
this.childImage.src = this.childImage.overImage.src;
}


////////////////////////////////////////////////

1-I do understand "if iam right, lol" that here
///currentImage.outImage = new Image();///
and here
///currentImage.overImage = new Image();///
and here
///currentImage.clickImage = new Image();///

we are creating an image object "overImage" on the fly which still a property of currentImage object, to keep track and store the current image and new image src.

but here
///currentImage.parentNode.childImage = currentImage;///
I am unable to see the point behind creating the childImage object
-same rule applied here???
is it really a brand new independent object "still a property of the parent" created on the fly like before?
and if so
-what is is purpose here??

how the cildImage object is interacting here, what is its purpose? and how it is able to modify "actually change" the <a> object child node Image object "currentImage".

it seems stupid question but its quiet simple
---///currentImage.parentNode.childImage = currentImage;///
here I have an object on the fly, a new Image object "childImage", that is Fine until now.
---///this.childImage.src = this.childImage.outImage.src;///
now how the childImage became able to change my parent "<A>" child "currentImage" src ??? how it "childImage" became displayable at all

is is because of the assignment here
///currentImage.parentNode.childImage = currentImage;///
???
Yes i assigned currentImage to the childImage, but based on my java programing concepts background each still independent objects refrences representing two different objects
---->and so based on that here is these functions rollOutParent(), rollOverParent()
am supposed to say something like
***this.currentImage.src = this.childImage.src*** or
***this.childImage.src = this.childImage.outImage.src;***or whatever "i know thats wrong coding here am just giving example".

------------
am confused, how with this simple line of code
currentImage.parentNode.childImage = currentImage;
childImage became able to define the currentImage ?

and if so, how this was achieved, hoe the Objects is being represented and how they interact in the core memory?

I'm trying to reuse some code in a different context to do a different job.

The code to be reused contains hundreds of lines similar to a = new b.c.d(e,f) with different value for e and f.

I need to create a new user defined object with the structure b.c.d. I've made numerous attempts along the lines of:

Code:

function d (e, f) {
   this.e = e;
   this.f = f;
}

function c () {
   this.d =  d (e, f);
}

function b () {
   this.c = c;
}

var a = new b.c.d("test", "message");

with various permuations of functional declarations.

However I get error message "Object expected" or "b.c.d is null or not an object" at the final line of the example.

It works with the test line var a = new d("test", "message") but not when I start to build up the expression.

How should I define of b.c.d?

I am able to do the following;
Code:

alert(myObject.Income.EESA.Name);

However I'm looking at
Code:

alert(myObject.Income[0].Name);

Or even better, not the full name, just "EESA". I need to loop through as you can see at the end of this script what I'm working on.
Code:

<script type="text/javascript">
var EESARate = 289.3;
var DLARate = 111.20;
var CARate = 61.35;
var SkyCost = 54.75;
var PerfectHomeCost = 28.17;
var CreditExpertCost = 14.99;
var UnitedUtilitiesCost = 8.13;
var BTCost = 57.18;
var AdobeCCCost = 46.88;
var TVLicenceCost = 6.06;
var GasCost = 10.00;
var ElectricCost = 20.0;
var ServerPackageCost = 9.99;
var USDValue = 123; //Fetch the value

var myObject = {
    "Income": {
        "EESA": {
            "Name": "Enhanced Employment and Support Allowance",
            "Amount": {
                "GBP": EESARate,
                "USD": EESARate * USDValue
            },
            "Frequency": {
                "When": "14",
                "Next": "30/10/2014"
            },
            "Description": "",
        },
        "DLA": {
            "Name": "Disibility Living Allowance",
            "Amount": {
                "GBP": DLARate,
                "USD": DLARate * USDValue
            },
            "Frequency": {
                "When": "7",
                "Next": "Wednesday"
            },
            "Description": "",
        },
        "CA": {
            "Name": "Carers Allowance",
            "Amount": {
                "GBP": CARate,
                "USD": CARate * USDValue
            },
            "Frequency": {
                "When": "7",
                "Next": "Saturday"
            },
            "Description": "",
        },
    },
    "Bills": {
        "Sky": {
            "Name": "Sky",
            "Amount": {
                "GBP": SkyCost,
                "USD": SkyCost * USDValue
            },
            "Frequency": {
                "When": "30",
                "Next": "XX/XX/XX"
            },
            "Description": "",
        },
        "PerfectHome": {
            "Name": "Sky",
            "Amount": {
                "GBP": PerfectHomeCost,
                "USD": PerfectHomeCost * USDValue
            },
            "Frequency": {
                "When": "7",
                "Next": "Wednesday"
            },
            "Description": "",
        },
        "CreditExpert": {
            "Name": "Experian Credit Expert",
            "Amount": {
                "GBP": CreditExpertCost,
                "USD": CreditExpertCost * USDValue
            },
            "Frequency": {
                "When": "30",
                "Next": "XX/XX/XX"
            },
            "Description": "",
        },
        "UnitedUtilities": {
            "Name": "United utilities",
            "Amount": {
                "GBP": UnitedUtilitiesCost,
                "USD": UnitedUtilitiesCost * USDValue
            },
            "Frequency": {
                "When": "7",
                "Next": "Wednesday"
            },
            "Description": "",
        },
        "BT": {
            "Name": "British Telecomunications",
            "Amount": {
                "GBP": BTCost,
                "USD": BTCost * USDValue
            },
            "Frequency": {
                "When": "30",
                "Next": "XX/XX/XX"
            },
            "Description": "",
        },
        "AdobeCC": {
            "Name": "Adobe Creative Cloud Suite",
            "Amount": {
                "GBP": AdobeCCCost,
                "USD": AdobeCCCost * USDValue
            },
            "Frequency": {
                "When": "30",
                "Next": "XX/XX/XX"
            },
            "Description": "",
        },
        "TVLicence": {
            "Name": "Television Licence",
            "Amount": {
                "GBP": TVLicenceCost,
                "USD": TVLicenceCost * USDValue
            },
            "Frequency": {
                "When": "30",
                "Next": "XX/XX/XX"
            },
            "Description": "",
        },
        "Gas": {
            "Name": "Eon Gas",
            "Amount": {

                "GBP": GasCost,
                "USD": GasCost * USDValue
            },
            "Frequency": {
                "When": "7",
                "Next": "Wednesday"
            },
            "Description": "",
        },
        "Electric": {
            "Name": "Eon Electric",
            "Amount": {
                "GBP": ElectricCost,
                "USD": ElectricCost * USDValue
            },
            "Frequency": {
                "When": "7",
                "Next": "Wednesday"
            },
            "Description": "",
        },
        "ServerPackage": {
            "Name": "1&1 Unlimited Plus (12 mo. term)",
            "Amount": {
                "GBP": ServerPackageCost,
                "USD": ServerPackageCost * USDValue
            },
            "Frequency": {
                "When": "30",
                "Next": "XX/XX/XX"
            },
            "Description": "",
        },
    },
};

var IncomeTotal = 0;
for (var k in myObject.Income) {
    if (myObject.Income.hasOwnProperty(k)) {
       ++IncomeTotal;
    }
}
alert(myObject.Income.EESA.Name);
document.write('<table>')
for(i = 0; i < IncomeTotal; i++){
   document.write('<tr>')
   document.write('<td>row ' + (i+1) + ', column 0</td>')
   document.write('</tr>')
}
document.write('</table>')
var TotalBills = 0;
for (var k in myObject.Bills) {
    if (myObject.Bills.hasOwnProperty(k)) {
       ++TotalBills;
    }
}
//alert(TotalBills);

</script>

Greetings!

This is actually a two part question from the html source I attached as a .txt document (too big for the post).

1) How can I get the name of an object. I took my failed attempt in the function named disableJobStream:

Code:

function disableJobStream(obj)
{
if((obj.value == "completed")  && (getRadioCheckedValue("shift") ==  "2"))
	{   
		if(obj.name == "artprogs")
			{ document.shiftreport.artprogs.disabled = true; }
	}


<select style="100px;" name="artprog_stat" OnChange="disableJobStream(this)"><option style='background-color:white;' value='none'selected='selected'>None</option>

<option style='background-color:red;' value='stopped'>Stopped</option>
<option style='background-color:yellow;' value='running'>Running</option>
<option style='background-color:green;' value='completed'>Completed</option>
</select>

2) Once I put my form through validation any of the fields that I disabled become enabled again. How would I go about keeping that from happening?

Page is too large to post and too large to put up as an attachment!

Thanks for your help!

Hello there folks,

First time poster, so please be gentle

I am ok with using objects creating classes if someone else defines, but when it comes to defining my own, I hit a nasty brick wall...

I am using an XML/XSLT wrapper called Sarissa to help with programming a utility to transform XML into HTML in different views.

For this to happen, I have created a Loader class which loads in XML required. I am aware of prototyping for binding methods to objects (as opposed to replicating the same method every time an instance is created)... The aim being I want to create a progress bar for the essential files that need to be loaded in. Presently I have them load in Synchronous mode just to get the utility working, which I know is poor, so would like to address it.

So can someone answer me this:

I understand why this works:

Code:

var SWMU = new Object();

SWMU.stylesheets = new Object;
SWMU.joblot = null;
SWMU.cache = new Object;
SWMU.filtering = new Object;
SWMU.locns = null;

function Loader(sXml, sTitle) {
	this.doc = Sarissa.getDomDocument();
	this.doc.load(sXml);
	this.doc.summary = sTitle;
	this.doc.onreadystatechange =  function() {if(this.readyState) 
		{alert(this.summary + " state change to..." + this.readyState);} else 
		{alert(this.summary + " state change to..." + this.doc.readyState);}
	}
}

function async() {
	SWMU.stylesheets[0] = new Loader("swmu_test/swmu_berthing.xsl", "Main SWMU Stylesheet");
	SWMU.stylesheets[1] = new Loader("assets/xsl/controls.xsl", "Drop down boxes");
}

function _init() {	
	async();
}

as it recreates the "this.doc.onreadystatechange" anonymous function everytime an instance is created (which is yuck).

However, when I do this (using prototype)...

Code:

var SWMU = new Object();

SWMU.stylesheets = new Array;
SWMU.joblot = null;
SWMU.cache = new Object;
SWMU.filtering = new Object;

// Now define the Loader object
// Create the loader method for dealing with items loaded
function Loader(sXml, sTitle) {	
	this.doc = Sarissa.getDomDocument();
	this.doc.load(sXml);
	this.doc.summary = sTitle;
}

function rHandler() {alert(this.summary + " State changed to... "+this.readyState);}

// Create the request handler 
Loader.prototype.doc = {};
Loader.prototype.doc.onreadystatechange = rHandler;

function async() {
	SWMU.stylesheets[0] = new Loader("swmu_test/swmu_berthing.xsl", "Main SWMU Stylesheet");
	SWMU.stylesheets[1] = new Loader("assets/xsl/controls.xsl", "Drop down boxes");
}

function _init() {	
	async();
}

Nothing happens and no errors are thrown, though there should be an alert box everytime there is state change to the progress of a file loading.

Can someone help me with this? Apologies if this is on the basic side, but it has been causing me a headache all week, and I can not find any answers on this.

Shaun

Probably a noob question but I'm to the point where I need suggestions.

I am trying to make an object that adds more objects to the page onclick. For example, I have an image (lets say its a plus sign) that I want users to click to add a new predesignated image (lets say its an image that the user can label with text) to the page. I want the user to be able to create a page/list full of user labeled images.

Thanks.

Could someone please explain the difference in these two methods of creating objects:

//anonymous self invoking function providing private methods
var a_module = (function() {
var private_variable = "some value";

function private_function() {
//some code
}

return {
public_property: "something"
//etc
}
}()
);
//Can use a_module.public_property with this

Is there any difference between the above and this:

var A_module - new Object();
A_module(property1, property2) = {
this.property1 = property1;
this.property2 = property2;
this.methodName = function(){//code}
}

A_module.prototype.property = "//property"
A_module.newMethod = function() {//code}




Are they both just different ways of creating objects with methods and properties?

Can someone please tell me why there is an error with my code (see in red below). I am told that 'process' is not an object or is null and I don't understand why or the implications with the click event which I am trying to capture and pass to my function:

Javascript Code:
Code:

var USStates = new Array(50);

USStates[0] = "Alabama"; 
USStates[1] = "Alaska"; 
USStates[2] = "Arizona";
USStates[3] = "Arkansas";
USStates[4] = "California";
USStates[5] = "Colorado";
USStates[6] = "Connecticut";
USStates[7] = "Delaware"; 
USStates[8] = "Florida";
USStates[9] = "Georgia";
USStates[10] = "Hawaii";
USStates[11] = "Idaho";
USStates[12] = "Illinois";
USStates[13] = "Indiana";
USStates[14] = "Iowa";
...


var stateEntered = new Array(50);


stateEntered[0] = "1819";
stateEntered[1] = "1959";
stateEntered[2] = "1912";
stateEntered[3] = "1836";
stateEntered[4] = "1850";
stateEntered[5] = "1876";
stateEntered[6] = "1788";
stateEntered[7] = "1787";
stateEntered[8] = "1845";
stateEntered[9] = "1788";
...

 var process  = document.getElementById("search"); 

process.onclick = getStateDate;

function getStateDate()
{

	var selectedState = document.getElementById("entry").value;
	for (var i = 0; i < USStates.length; i++)
	{
			if (USStates[i] == selectedState)
			{
				break;
			}
	}
		if (i < USStates.length)
		{
			alert(selectedState + " entered the Union in " + stateEntered[i] + ".");
		} else
		{
			alert("Sorry, '" + selectedState + "' isn't a US State.");
		}
}

HTML Code ( in case you need it):
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Loops</title>
<script type="text/javascript" src="loops.js"></script>  
</head>

<body>
<h2>Enter a US Sate in the field below and click the 'submit' button to get the date of entry in the union</h2>
<form action="process.php">
	<input type="text" id="entry" name="entry" />
	<input type="button" id="search" name="search" value="submit" />
</form>
</body>

</html>

I am having some issues with my code...
The code is supposed to ask for an average of the values in the numeric property (Cost), which works, but it repeating itself twice. Also, I need to calculate and display the number of elements of (Cost), whose numeric property values is greater than the average. ANY help is highly appreciated ...

Thanks!



var expense = new Array();
var loop;
var property;
var numExpense;
var LOOP_START = 1;
var average = 0;
var numberAverage = 0;

numExpense=parseInt(prompt("How many expenses?"));

for (loop = 0; loop < numExpense; loop++)
{
expense[loop] = new Object();
}

expense[0].Name = prompt("Expense Name?");
expense[0].Cost = parseFloat(prompt("Expense Cost ?"));
expense[0].Type = prompt("Expense Type?");
expense[0].Location = prompt("Expense Location?");

for (loop = LOOP_START; loop < numExpense; loop++)
{
expense[loop].Name = prompt("Expense Name?");
expense[loop].Cost = prompt("Expense Cost?");
expense[loop].Type = prompt("Expense Type?");
expense[loop].Location = prompt("Expense Location?");
}

document.write("<br /> <h2> Expenses </h2>");
for(loop = 0; loop < numExpense; loop ++)
{
for(property in expense[loop])
{
document.write("<br />Expense # " + (loop + 1) + " " + property + " : " + expense[loop][property]);
}
document.write("<br />");
}

for(loop = 0; loop < numExpense; loop ++)
{
for(property in expense[loop])
{
average=expense[loop].Cost/numExpense
}
document.write("<br />Average Cost: $ " + average);
}


for(loop = 0; loop < numExpense; loop ++)
{
for(property in expense[loop])
{
parseInt(numberAverage) = numExpense > average
}
document.write("<br />Number of expenses more than Average: $ " + numberAverage);
}

I am trying to set up a chat window in my website. Pretty much I have the main page, and a pop-out child page that contains the chat. I want users to be able to change pages on the main page, but the issue is that when they change the page, the reference to the child page (where the chat is) is lost, is there a way to make the window object persistant such as serializing it and putting it in a cookie? It looks like JSON is made for like functions, but can't really serialize a window object. Does anyone have any ideas?

Hello,
I have an Object, containing an object, containing an object....etc.
So, it's an Object of objects. Not an Array of objects.
And now I want to sort this Object of objects.
Is there a "native" way in JavaScript to sort an object?
Or do I understand it correctly, that I first have to convert the Object to an Array, and than perform an array.sort ?

This question is just for my understanding of JavaScript, so I don't go into the wrong direction.
Tnx in advance for any explanation.

Hello!

I have a pretty straight forward question dealing with JQuery/Javascript (I'm pretty new to both, so the syntax is still escaping me). I have a javascript file that holds an array of objects inside of it (addresses to be exact) and I then need to take that array and call it to print into the Title attribute of a <li> after the list has been populated.

Below is the Javascript arrray:
Code:

var banner_data = [ "address1","address2","address3","address4"];
var obj = { one:"address1", two:"address2", three:"address3", four:"address4" }

And this is how it is being called in the HTML:
Code:

$('ul>li').each(function(){
      var $this = $(this); // current list item
      var idx = $this.index();
      var thisAddress = banner_data[idx]; 
	  $this.attr('title', thisAddress.append[4])
});

any thoughts? I have jQuery 1.7.1 installed, a fully valid html/css and a proper doctype (just to cover our bases haha)