[Dormilich]

IceHot, on 26 November 2012 - 12:51 PM, said:

and the user gets to pressing one of the buttons, where is the pointer in the HTML document?

why should there be a pointer in the HTML document? all that matters is the JS code.

IceHot, on 26 November 2012 - 12:51 PM, said:

P.S.: I was thinking that I would have to call some function to attach the event listeners.

sounds like a good idea.

IceHot, on 26 November 2012 - 12:51 PM, said:

Of course, the lazy way would be to include the code in sample project button 1 js file.js DIRECTLY IN THE HTML FILE, and then call the function needed, but this is kinda like using system() in C++: a no-no. Why?

- (as said) easy to maintain (you only work in JS, not in a JS-HTML-mixture)
- you can apply the .js file to more than one HTML file (and thus, if you modify the JS, you modify it for each HTML)
- external files are cached in the browser, so you save bandwidth
- content-code-separation

IceHot, on 26 November 2012 - 12:51 PM, said:

and just as mentioned in one of the Google submissions, if the user has the Javascript disabled and tried to click the button, NOTHING HAPPENS! (This ought to be much easier than it is seeming right now.)

the work-around would be either that JS creates (or enables/displays) the buttons as well, or that you have non-JS default actions (applies not to all buttons)

[IceHot]

I have modified my HTML and my Javascript code. In my HTML file, I am just calling the action function in this file

function initialize()
{
	var a = new Array();
	var buttonsarray = Array("buttona","buttonb","buttonc","buttond");
	var temp = document.getElementsByTagName('button');
	for (var x = 0; x < 4; x++) a[x] = document.getElementsByName(buttonsarray[x]);
	//We want our event listener to fetch the data in the boxes provided and pass it to the color attribute
	//To do that, we should probably define a function to do that...
	//NOTE: The fields will have names corresponding to the significance of the data they are holding.
	//Again, I am using arrays to automate this process
	var strarray = Array("textred", "textgreen", "textblue");
	var intarray = Array(0, 0, 0);
}	//end initialize

function setcolor()
{
	
	//get the text from the fields (manually, so I don't make mistakes)...
	for (var x = 0; x < 3; x++) strarray[x] = document.getElementById(strarray[x]).value;
	alert ("document.getElementById('textred').value == "+document.getElementById("textred").value);
	//parse it to integers (hexadecimal)
		//parseInt(string,16) or append "0x" to all strings and then parseInt(string)
	for (var x = 0; x < 3; x++) intarray[x] = parseInt(strarray[x],16);
	alert ("Your entries are as follows:\nfirst box: "+inta+"second box"+intb+"third box"+intc);	//This pop-up window is a test
	//check if one or two integers has been entered (and enforce type consistency)
	if ((strarray[0].length() == 1) || (strarray[0].length() == 2))
	{
		for (var x=1; x < 3; x++)
		{
			if ((strarray[x].length() == 0) || (strarray[x].length() > 2)) alert ("Please type only one or two digits in the box.");
		}	//end for
	}	//end if
	else alert("ERROR: You should only input one or two digits in the boxes.");
	//Use modular arithmetic to form the value to set the color to
	//Maybe get information about the thing being set. If it is background, set ALL BACKGROUNDS to user-defined color
}	//end setcolor

function action()
{
	initialize();
	if (a[0].addEventListener)
	{
		//This will work on everything but IE
		for (var x = 0; x < 4; x++) a[x].addEventListener('click', setcolor, false);
	}	//end if
	else if (a[0].attachEvent)
	{
		for (var x = 0; x < 4; x++) a[x].attachEvent('onclick', setcolor);
	}	//end else
}	//end action

, but the Web Developer extension is throwing the error that a is not defined. Why?

[Dormilich]

IceHot, on 26 November 2012 - 01:44 PM, said:

but the Web Developer extension is throwing the error that a is not defined. Why?

Scope.

variable a only exists in initialize() and not outside of it. you would have to execute action()’s code block inside initialize(). (and usually you would write a wrapper for addEventListener()/attachEvent() to take care of the browser issues.)

[IceHot]

What is a wrapper? And aren't the if-statements enough? (Maybe this is why setcolor won't execute or throw error?)

This post has been edited by IceHot: 26 November 2012 - 06:01 AM

[Dormilich]

the if() statements would work, but the way it is right now, it is not the least generic. imagine if you have to attach a lot of event handlers, every time you’d re-write that part of the code.

a more generic event wrapper: http://www.dreaminco...snippet5497.htm

[IceHot]

The solution that I have had SINCE I STARTED THIS is to just include an external Javascript file (like I already done) and then just use the

onclick = setcolor()

(and then just put everything in setcolor()). This, I think, is the cheap way to do it, I just don't know if it is the right way. Sometimes, I wish I knew of the right questions to ask at the right time.

[Dormilich]

the problem is the assignment you have there. the onevent properties expect function variables to be given, not function return values. i.e. EventTarget.onclick = setcolor;

[no2pencil]

IceHot, on 01 November 2012 - 04:24 PM, said:

I heard w3schools.com is "evil" because they lead people into the habits that get their code hacked by run-of-the-mill script kiddies.

I've always said : Programming is easy, because it's just following syntax. The job of a programmer, however, is creating logic for preventing human error. So you don't code things to work, you code them to prevent failure.

If someone isn't smart enough to move beyond 'just working code' to 'secure code', how is that the fault of someone showing syntax? In fact, it's hardly anyones fault, except for the coder.

[Xupicor]

IceHot, on 06 November 2012 - 09:16 AM, said:

That's backwards! It also goes against programming common-sense of how to define functions! Python, C, C++, and Java all use the parenthesis at the end of their function that is being defined (at the function declaration statement). But me and the magic fairies of this land have a misunderstanding: I should have been better with my array usage. (I tried to make an array of variables. Shame on me...)

It's actually quite THE SAME in terms of syntax in C and C++.

//Javascript
function shout() { alert("Boo hoo!"); }
var f = shout; // you don't want to call it here!

//C
void shout(void) { puts("Boohoo!"; }
typedef void (*function_type)(void);
function_type f = shout;

//C++
void shout() { std::cout << "Boohoo!"; }
auto f = shout;
//or
std::function<void()> f = shout;

//Python
def shout():
  print "Boohoo!"

f = shout

//try it with 
f()
//in a given language, add semicolon where appropriate ; )

It looks like you were grossly confused on what you did vs what you were supposed to do.

You might want to get a book on the subject rather than just learning as you go.

This post has been edited by Xupicor: 28 November 2012 - 11:33 AM

[IceHot]

Holy crap, I caught my own error: I was trying to chain getElementById with getElementsByTagName, which was completely unnecessary. Cause: I was so focused on trying to get this done as soon as possible, I didn't pay attention to the global attributes (namely id)! Geez, I guess stress makes idiots of everyone...By the way, this has been a valuable learning experience, especially with what you were all suggesting. I give my biggest thanks to Dormilich! I will continue to work on this project, and learn as much as I can. I also learned how to learn. Thanks for that lesson, Dormilich!

[IceHot]

Oh, and if you already have your .css files for the different attributes (with the color pre-defined), could you use

element.style.color(value)

?

[Dormilich]

nope, .color is not a function, it’s a string property. i.e. element.style.color = value;

[IceHot]

Yes, good catch! Of course, it won't work when trying something like

document.getElementsByTagName('p').style.color = value;

Can someone provide a reason as to why this is the case? I was thinking, as an alternative, I could just manipulate the CSS rules with this: http://stackoverflow...with-javascript

[Dormilich]

because document.getElementsByTagName() always returns a list (NodeList) and not a single element. (it doesn’t say Elements for no reason)

[IceHot]

Could someone tell me why this is throwing error:

<!DOCTYPE HTML>
<html>
<body>
	<link rel = "stylesheet" href= "sample project CSS file h1.css">
	<link rel = "stylesheet" href = "sample project CSS file p.css">
	<link rel = "stylesheet" href = "sample project CSS file pre.css">
	<link rel = "stylesheet" href = "sample project CSS file body.css">
	<h1>This is a title!</h1>
	<p>I am a paragraph element!</p>
<pre>
I am pre-formatted text. Change me.
</pre>
<script>
var x = -1;
var y = 0;
while ((x < 0) || (x > 3)) x = prompt("Please enter an integer between 0 and 3: ");
y = prompt("Now enter a hexadecimal number that is between 3 and 6 digits long");
var cssRuleCode = document.all?'rules':'cssRules';
var stylesheet = document.styleSheets[x];
alert(stylesheet.cssRuleCode[0].cssText);	//should return the text in the CSS document
</script>
</body>
</html>

The alert statement is throwing error, but I am only doing what mozilla.org is suggesting I do.

This post has been edited by IceHot: 09 December 2012 - 03:52 AM