Javascript questions which don't deserve their own thread.

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

«‹›277 »

Suspicious Dish: Sep 24, 2011; 2020 is the year of linux on the desktop, bro; Fun Shoe

Well, spaces are the superior option :colbert:

# ? Dec 17, 2012 08:23

Adbot: ADBOT LOVES YOU

# ? May 28, 2024 01:57

Doc Hawkins: Jun 15, 2010; Dashing? But I'm not even moving!

LordAndrew posted:

The commit message on GitHub just says "use_spaces".

I'm pretty sure that Crockford's commit messages have come up in the coding horrors thread at least once.

# ? Dec 17, 2012 08:24

akadajet: Sep 14, 2003

Wheany posted:

e: Wait, so using tabs is not even an option? It just straight-up does not allow the tab character anywhere?

Looks like he removed an option called "mixed" that detects mixed tabs and spaces, then added one called "use_spaces" that just detects tabs. Probably just a defaults thing. The commit comment is lazy and misleading.

akadajet fucked around with this message at 12:22 on Dec 17, 2012

# ? Dec 17, 2012 12:18

LordAndrew: Jul 13, 2009; Walking death machine equipped with the knowledge of Nuclear.

akadajet posted:

Looks like he removed an option called "mixed" that detects mixed tabs and spaces, then added one called "use_spaces" that just detects tabs. Probably just a defaults thing. The commit comment is lazy and misleading.

Is there a way to toggle it so that I can use tabs, or should I start learning to embrace spaces for indentation?

# ? Dec 17, 2012 12:29

akadajet: Sep 14, 2003

LordAndrew posted:

Is there a way to toggle it so that I can use tabs, or should I start learning to embrace spaces for indentation?

Just tested my theory of setting "use_spaces: true" and it didn't work. So I don't really know what to tell you.

# ? Dec 17, 2012 12:59

Suspicious Dish: Sep 24, 2011; 2020 is the year of linux on the desktop, bro; Fun Shoe

Just use spaces.

# ? Dec 17, 2012 13:06

Deus Rex: Mar 5, 2005

edit: never mind, i literally don't know what i'm saying

Deus Rex fucked around with this message at 13:40 on Dec 17, 2012

# ? Dec 17, 2012 13:11

Suspicious Dish: Sep 24, 2011; 2020 is the year of linux on the desktop, bro; Fun Shoe

As far as I can tell, use_spaces is not an option nor a preference.

# ? Dec 17, 2012 13:19

Wheany: Mar 17, 2006; Spinya^{ha^{ha^haha}ha}ha_{ha_{ha_haha}ha}ha!; Doctor Rope

Deus Rex posted:

where did he say anything like this?

In the part where he says "My advice on JSLint: don�t use it. Why would you use it? If you believed that it helps you have less bugs in your code, here�s a newsflash; only people can detect and solve software bugs, not tools."

var someNumber = 3;
soemNumber = 4;

Now you have a local variable called "someNumber" and a global named "soemNumber"

# ? Dec 17, 2012 13:32

akadajet: Sep 14, 2003

Wheany posted:

var someNumber = 3;
soemNumber = 4;

Now you have a local variable called "someNumber" and a global named "soemNumber"

Bet you wont make that mistake again after spending an hour debugging it. Character building. :colbert:

# ? Dec 17, 2012 13:37

Deus Rex: Mar 5, 2005

Wheany posted:

In the part where he says "My advice on JSLint: don�t use it. Why would you use it? If you believed that it helps you have less bugs in your code, here�s a newsflash; only people can detect and solve software bugs, not tools."

var someNumber = 3;
soemNumber = 4;

Now you have a local variable called "someNumber" and a global named "soemNumber"

enabling strict mode is even better than jslint for detecting this, since the second line throws an exception:

http://jsbin.com/omefen/2/edit

"static analysis tools can't detect bugs" is a pretty dumb thing to say for sure, but i hardly think that equates to "Global variables are totally cool and the more you use them, the better".

# ? Dec 17, 2012 13:47

Wheany: Mar 17, 2006; Spinya^{ha^{ha^haha}ha}ha_{ha_{ha_haha}ha}ha!; Doctor Rope

Deus Rex posted:

enabling strict mode is even better than jslint for detecting this, since the second line throws an exception:

http://jsbin.com/omefen/2/edit

"static analysis tools can't detect bugs" is a pretty dumb thing to say for sure, but i hardly think that equates to "Global variables are totally cool and the more you use them, the better".

http://jsbin.com/omefen/3/edit

JSLint catches the typo even in the delayed function without having to wait for the code to run. Of course instead of a delayed function, that mistake could be in you ajax failure callback or somewhere else which is rarely run.

# ? Dec 17, 2012 14:07

BexGu: Jan 9, 2004; This fucking day....

Hey Guys,

I'm using the Backbone.js framework along with modelbinder/backbone.validations from GitHub. I've setup the page to do error validation on text fields/radio buttons and everything's working great, but I was wondering if any on has had experience/knows of any examples of doing error validation with check boxes with modelbinder. I need to set it up that if the user doesn't select one (or more) of a group of check boxes they get a error on forum submit.

# ? Dec 17, 2012 17:01

smug forum asshole: Jan 15, 2005

post some code and we'll help you figure it out

# ? Dec 17, 2012 18:12

BexGu: Jan 9, 2004; This fucking day....

smug forum rear end in a top hat posted:

post some code and we'll help you figure it out

Sure, give me a few this might bit to break apart to fit in a post.
For background and bit better description I'm having the same issue described here: https://github.com/theironcook/Backbone.ModelBinder/issues/75
For a quick way to mess around with a similar setupand see what works/doesn't I've been using this: http://jsfiddle.net/43cgL/36/

So I have in my View that modelBinder binds everything

code:

                render: function(){
		this.modelBinder = new Backbone.ModelBinder();
		this.modelBinder.bind(this.model, this.$el);
	}

defined my validation rule in the Model

code:

defaults : {
   ....
   adultContactType : ""
   ...
},
validate: 
	{
             .....
               adultContactType : {
			type : "NotBlank"
		},
}

And in the HTML I experimented with something like this

code:

<fieldset>
                                                <legend class="form_label">I can get information by:</legend>
                                                <input type="checkbox" id="adultAlertsText1"  name="adultContactType " />
                                                <label class="checkBox_label" for="adultAlertsText1">
                                                    Text</label>
                                                <br />
                                                <input type="checkbox" id="adultAlertsEmail1" name="adultContactType " />
                                                <label class="checkBox_label" for="adultAlertsEmail1">
                                                    Email</label>
                                                <br />
                                                <input type="checkbox" id="adultAlertsPaperless1" name="adultContactType " />
                                                <label class="checkBox_label" for="adultAlertsPaperless1">
                                                    Check here if you want to get paperless notices</label>
                                            </fieldset>

The problem is that when I gave them the same name checking one causes all the other to be checked as well. So kind of a dead end I was just playing around with. If I do something like this:

code:

<fieldset>
                                                <legend class="form_label">I can get information by:</legend>
                                                <input type="checkbox" id="adultAlertsText1"  name="adultAlertsText1" />
                                                <label class="checkBox_label" for="adultAlertsText1">
                                                    Text</label>
                                                <br />
                                                <input type="checkbox" id="adultAlertsEmail1" name="adultAlertsEmail1" />
                                                <label class="checkBox_label" for="adultAlertsEmail1">
                                                    Email</label>
                                                <br />
                                                <input type="checkbox" id="adultAlertsPaperless1" name="adultAlertsPaperless1" />
                                                <label class="checkBox_label" for="adultAlertsPaperless1">
                                                    Check here if you want to get paperless notices</label>
                                            </fieldset>

I will be binding validation to each individual check box, (with its own error validation check) instead of a group as a whole. Considering there are three basic times where the value of the three check boxes have to be considered:
1. If the user checks a checkbox and then unchecks it so that none of the three values are displayed display a error message.
1. On save/continue, all error validation is run on all the values of the forum. If there is a error (in this case, at least 1 of the 3 check boxes is not selected) a message is displayed.
2. After a save/continue remove the error message once the user clicks on one or more check box the error message needs to be removed.

I'm not sure how to create a ModelBinder event that watches three (or more) values at once.

# ? Dec 17, 2012 19:48

Vlaphor: Dec 18, 2005; Lipstick Apathy

Wrong thread. Will move to right one.

Vlaphor fucked around with this message at 00:41 on Dec 18, 2012

# ? Dec 17, 2012 22:58

Deus Rex: Mar 5, 2005

Wheany posted:

http://jsbin.com/omefen/3/edit

JSLint catches the typo even in the delayed function without having to wait for the code to run. Of course instead of a delayed function, that mistake could be in you ajax failure callback or somewhere else which is rarely run.

cool! jslint and tools like it (jshint, closure linter) are very useful.

# ? Dec 17, 2012 23:29

akadajet: Sep 14, 2003

Vlaphor posted:

We have to use Java to draw an X-mas scene, but only using triangles and houses.

This is the Javascript thread. Java is another language entirely. The guys in the Java or homework threads could probably point you in the right direction.

# ? Dec 18, 2012 00:25

pksage: Jul 2, 2009; You are an experience!
Make sure you're a good experience.

Got another ExtJS specific question, one that Google has been no help with.

I've got an infinite scrolling grid with a CheckColumn that I use to mark a record as dirty (changed). If the user marks a row as changed and then scrolls away from it, it will no longer be loaded into the store, because of how buffering for infinite scroll works. I was hoping that the clearOnPageLoad Store config would fix this, but it doesn't seem to apply to caching in buffered grids. The only listener I've been able to hook up to it is "beforeprefetch", which hasn't been doing what I need it to do -- specifically, it doesn't actually cancel a prefetch like it says it does when you return false. The changed rows are already cycled out of the store by the time beforeprefetch fires.

How can I set up my grid to recognize my changed rows even after they're scrolled out of the store? I need my "Save Changes" button to affect all rows, and not just the currently visible ones. Am I gonna have to do some overriding?

pksage fucked around with this message at 22:16 on Dec 18, 2012

# ? Dec 18, 2012 22:13

Boz0r: Sep 7, 2006; The Rocketship in action.

I'm trying to learn TypeScript, and I have this little piece of code:

code:

private storage : Array;

constructor() {
	this.storage = new Array();
}


"Cannot convert 'any[]' to 'Array'"

How should I be writing this?

# ? Dec 20, 2012 17:04

corgski: Feb 6, 2007; Silly goose, you're here forever.

TypeScript only supports four types: number, bool, string, and any (untyped.) 'Array' is not a valid type.

It's throwing an error on the first line.

Also, holy poo poo, that is one of the worst documented supersets to javascript I've ever looked at.

# ? Dec 20, 2012 17:14

Boz0r: Sep 7, 2006; The Rocketship in action.

Yeah, and it isn't even finished yet.

I solved the problem by writing this instead:

code:

class Multiset {
	private storage = new Array();
	
	constructor() {
		this.storage = new Array();
	}

# ? Dec 20, 2012 17:45

Deus Rex: Mar 5, 2005

Boz0r posted:

I'm trying to learn TypeScript, and I have this little piece of code:
code:
private storage : Array;

constructor() {
	this.storage = new Array();
}


"Cannot convert 'any[]' to 'Array'"
How should I be writing this?

"Array" is not a type in TypeScript, but you can specify an array of a given type like:

JavaScript code:

function sum(xs : Number[]) {
	return xs.reduce( (acc,x) => acc+x);
}

edit: typescript owns owns owns and it's well-worth scouring the scarce documentation and reading the spec:

http://www.typescriptlang.org/Content/TypeScript%20Language%20Specification.pdf

Deus Rex fucked around with this message at 18:16 on Dec 20, 2012

# ? Dec 20, 2012 17:54

Emmideer: Oct 20, 2011; Lovely night, no?; Grimey Drawer

I'm trying to learn Javascript using codeacademy and I've run into a weird thing during one of the practices; despite following the instructions exactly, things aren't operating properly.

code:

// Declare multiplied outside the function on line 3.
// This will mean it has global scope. 
var multiplied;
var timesTwo = function(number) { 
    var multiplied = number * 2;
};
timesTwo(4);
// We cant access the variable multipled! 
// Do something so line 10 will work!
console.log(multiplied);

The only thing I did was add var multiplied in line three, exactly as it told me to. However, it's not making 8, as it is supposed to. What's going on?

# ? Dec 21, 2012 20:10

smug forum asshole: Jan 15, 2005

when you write var multiplied = number * 2 on line 3, you're defining a new variable named multiplied.

If you just say multiplied = number * 2 you'll re-use the variable you created in that outer scope. This is probably what you want to do.

# ? Dec 21, 2012 20:18

IAmKale: Jun 7, 2007; やらないか; Fun Shoe

Jon Joe posted:

I'm trying to learn Javascript using codeacademy and I've run into a weird thing during one of the practices; despite following the instructions exactly, things aren't operating properly.
code:
// Declare multiplied outside the function on line 3.
// This will mean it has global scope. 
var multiplied;
var timesTwo = function(number) { 
    var multiplied = number * 2;
};
timesTwo(4);
// We cant access the variable multipled! 
// Do something so line 10 will work!
console.log(multiplied);
The only thing I did was add var multiplied in line three, exactly as it told me to. However, it's not making 8, as it is supposed to. What's going on?

You need to update your timesTwo function. Change this:

JavaScript code:

var timesTwo = function(number) { 
    var multiplied = number * 2;
};

to this:

JavaScript code:

var timesTwo = function(number) { 
    multiplied = number * 2;
};

When you add var in front of a variable in a function, you're creating a variable local to that function - it can't be accessed from outside of the function unless you return it. By leaving out var, you're now modifying the global variable you created earlier.

e;fb

# ? Dec 21, 2012 20:18

Emmideer: Oct 20, 2011; Lovely night, no?; Grimey Drawer

Ah! Such a simple fix, thanks!

# ? Dec 21, 2012 20:19

Quote-Unquote: Oct 22, 2002

edit: I'm a moron and case matters; it's 'onclick' in javascript, not 'onClick'. Please ignore this.

Hey guys,
I've got a function that is adding additional td cells to a table, which also have an onClick event assigned to them. However, the function I want that event to call relies on using the keyword 'this' within it, which appears not to work.

Basically, the td should look something like

code:

<td onClick='myFunction(this)'>Some text</td>

and here's the javascript that's adding the function to the cell after it's been added to the table.

code:

...
newcell = row.insertCell(-1);
newcell.onClick = function() {myFunction(this);};

However, 'this' at that point is referring to something while the script is executing, but I need it to literally be the word 'this' as if it was written in html. The 'myFunction' needs to know what element was clicked on so using 'this' seemed to be the most sensible way, and it works fine if I write it in a html doc myself, but it doesn't work when added via javascript like this.
Any ideas?

Quote-Unquote fucked around with this message at 11:38 on Jan 4, 2013

# ? Jan 4, 2013 11:30

Wheany: Mar 17, 2006; Spinya^{ha^{ha^haha}ha}ha_{ha_{ha_haha}ha}ha!; Doctor Rope

newcell.onClick = function() {myFunction(newcell);};

# ? Jan 4, 2013 11:37

Quote-Unquote: Oct 22, 2002

Wheany posted:

newcell.onClick = function() {myFunction(newcell);};

Actually it seems that using 'this' works fine. I'm just an idiot; it's newcell.onclick, not newcell.onClick.
onClick works fine if you write it in the HTML doc but that's not the proper javascript capitalisation.

# ? Jan 4, 2013 11:39

thegasman2000: Feb 12, 2005; Update my TFLC log? BOLLOCKS!
/

I really need to paste the write code if I want help!

thegasman2000 fucked around with this message at 23:43 on Jan 4, 2013

# ? Jan 4, 2013 13:34

Video Nasty: Jun 17, 2003

At first glance: you are using spaces in the directory path for pre-loading your images. Might want to use %20 for the character.

# ? Jan 4, 2013 16:45

Jabor: Jul 16, 2010; #1 Loser at SpaceChem

Is that seriously just the show-a-different-image-on-rollover scripts from Dreamweaver that have been copy-pasted?

# ? Jan 4, 2013 17:20

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

Jabor posted:

Is that seriously just the show-a-different-image-on-rollover scripts from Dreamweaver that have been copy-pasted?

Yup. Whenever you see the MM_ prefix, it's time to run away.

# ? Jan 4, 2013 17:32

thegasman2000: Feb 12, 2005; Update my TFLC log? BOLLOCKS!
/

Jabor posted:

Is that seriously just the show-a-different-image-on-rollover scripts from Dreamweaver that have been copy-pasted?

I am a twat... that was the wrong code completely! The actual script is this

code:

<script type="text/javascript">
var loaded=false;
function loadedmove() {
	console.log("called");
	if (loaded!=true) {
		console.log("caran");
		document.getElementById("movetohere").innerHTML=document.getElementById("CentralArea").innerHTML;
		document.getElementById("CentralArea").innerHTML+="<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />";
	}
	loaded=true;
}



 if ( document.addEventListener ) {
            // Use the handy event callback
            document.addEventListener( "DOMContentLoaded", loadedmove, false );

            // A fallback to window.onload, that will always work
            window.addEventListener( "load", loadedmove, false );

        // If IE event model is used
        } else if ( document.attachEvent ) {
            // ensure firing before onload,
            // maybe late but safe also for iframes
            document.attachEvent( "onreadystatechange", loadedmove );

            // A fallback to window.onload, that will always work
            window.attachEvent( "onload",loadedmove );

            // If IE and not a frame
            // continually check to see if the document is ready
            var toplevel = false;

            try {
                toplevel = window.frameElement == null;
            } catch(e) {}

        }
		window.onload = loadedmove;




</script>

It is now working in all browsers except for IE... unfortunately this means most of the customers will get a messed up template.

Link to ebay store. http://stores.ebay.co.uk/total-outdoors1/Carp-Specialist-/_i.html?_fsub=4158216018&_sid=1017347228&_trksid=p4634.c0.m322

# ? Jan 4, 2013 23:43

Daynab: Aug 5, 2008

I'm trying to implement dragging and dropping an image in the browser and then drawing it to the canvas and its behavior is extremely weird, and I don't understand why.

How it's supposed to work: dragging an image on the red square should make it appear in the black square (the canvas).
What's going wrong is that it only actually works the second time you drag an image on it, as if it was caching it.

Demo and code: http://jsbin.com/uzepuj/1/edit

I tried making it so it would change the background of the red square, to see if my drag and drop was the issue, but that works just fine.

Any ideas?

edit: keep in mind if you change it, you will need to clear your cache or try a different image as any image you try for more than once will work.

# ? Jan 9, 2013 23:52

Wheany: Mar 17, 2006; Spinya^{ha^{ha^haha}ha}ha_{ha_{ha_haha}ha}ha!; Doctor Rope

I am guessing here that you should put reader.onloadend before reader.readAsDataURL.

Also: file, reader and img are global variables.

# ? Jan 10, 2013 00:15

Daynab: Aug 5, 2008

Wheany posted:

I am guessing here that you should put reader.onloadend before reader.readAsDataURL.

Also: file, reader and img are global variables.

Makes no difference, in fact that's how I had it before.

Fixed the vars (they were global just so I could try other solutions more easily) but yeah, no difference.
edit: even if I remove the whole separate function for drawing, the same thing happens. Is there something special about drawImage?
edit edit: Finally figured it out. I had to add an onload to the actual image and then it decided to work.

Daynab fucked around with this message at 08:11 on Jan 10, 2013

# ? Jan 10, 2013 00:58

Fenderbender: Oct 10, 2003; You have the right to remain silent.

thegasman2000 posted:

I am a twat... that was the wrong code completely! The actual script is this

code:

<script type="text/javascript">
var loaded=false;
function loadedmove() {
	console.log("called");
	if (loaded!=true) {
		console.log("caran");
		document.getElementById("movetohere").innerHTML=document.getElementById("CentralArea").innerHTML;
		document.getElementById("CentralArea").innerHTML+="[i]<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />[/i]";
	}
	loaded=true;
}



 if ( document.addEventListener ) {
            // Use the handy event callback
            document.addEventListener( "DOMContentLoaded", loadedmove, false );

            // A fallback to window.onload, that will always work
            window.addEventListener( "load", loadedmove, false );

        // If IE event model is used
        } else if ( document.attachEvent ) {
            // ensure firing before onload,
            // maybe late but safe also for iframes
            document.attachEvent( "onreadystatechange", loadedmove );

            // A fallback to window.onload, that will always work
            window.attachEvent( "onload",loadedmove );

            // If IE and not a frame
            // continually check to see if the document is ready
            var toplevel = false;

            try {
                toplevel = window.frameElement == null;
            } catch(e) {}

        }
		window.onload = loadedmove;




</script>

Yeesh. At least change that one line to (new Array(50)).join('<br />')

Also, your IE customers are probably failing on the console.log()

# ? Jan 10, 2013 16:09

Adbot: ADBOT LOVES YOU

# ? May 28, 2024 01:57

Fenderbender: Oct 10, 2003; You have the right to remain silent.

Also, on the conversation of linting. JSHint superiority. Also, you can create your own custom file. I'm a bit of a control freak about mine (post yr best jshintrc) and enforce it on my projects during build processes. Also I let git take care of the spacing issue for me if it somehow falls through the cracks.

code:

[core]
  whitespace = fix,space-before-tab,tab-in-indent,trailing-space

[apply]
  whitespace = fix

# ? Jan 10, 2013 16:43

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

«‹›277 »