Ask MetaFilter questions tagged with Javascript

=== JavaScript is actually not that ugly. ===

Nomyte — Wed, 12 Jun 2013 12:12:07 -0800

I'd like to learn basic CoffeeScript for a one-off project, but most of the books I've seen come from the perspective of the JS developer making the leap to CS. JS is ubiquitous and will no doubt come in handy in many more situations. What is a good pocket library of 3-4 books for someone new to JS and front-end web dev stuff, but not new to programming concepts? (For example, my C pocket library is K&R, Deep C secrets, and C: A Reference Manual. I know that the front-end web world is a lot richer than C-world, but do what you can to help me.)

What are the best sites for hiring front-end developers in the US?

grubby — Fri, 24 May 2013 11:00:37 -0800

Stackoverflow has been great for back-end developers, but not so much for the front-end people - I mean javascript frameworks + html5 + css. What are the best job sites for hiring front-end developers in the US?

Help me create a secondary dev environment, either Windows 7 or Ubuntu

nímwunnan — Thu, 09 May 2013 01:57:45 -0800

I'm a Mac-based webmonkey, and I need to sett up a secondary dev environment on an old Thinkpad X200. It currently runs... or rather slow-jogs Windows 7. I don't need the setup to be perfect, just something on which I can run an Apache / LAMP stack and occasional Sinatra / Rails apps without supreme annoyance. My goal is to put no more money into the software than I did the hardware ($175). This machine is for occasional light use, except for the month I'm taking it with me to Russia. So, umm, security tips would be helpful too! Thanks!

My current standards in OS X land:
Espresso
Git
MAMP
Sequel Pro
Chrome
Mou
Mountee
Cyberduck
Terminal
Textexpander
Propane
Sparrow
Jumpcut
Adobe CS5
Spotify
1Password
Adium
Harvest
Writeroom

I've checked alternativeto.net, but am curious about the opinions of Mefites.

ps I've seen this question but I assume that there will be updates in the last 5 years.

Show me the quick and dirty road to jquery/javascript proficiency

OlivesAndTurkishCoffee — Tue, 07 May 2013 17:06:38 -0800

I am hoping to become a fairly nimble noob with jQuery (and understand the javascript logic that goes with it) in about 3 weeks. What is the smartest way forward? I have been through a fair number of web tutorials (code school, codecademy, lynda, safari books) and I pretty must have the basics down. Can write functions, handle events, understand objects, etc..

But now that I've done that I don't know what the smartest next move is. There is a ton of documentation out there and I don't want to waste time getting in over my head. I am looking for more structured exercises or tutorials that take you all the way through building mock apps but don't know where to find them.

If I had unlimited time I would just start working on small projects and building them for fun for myself and/or on github--but I need to work smart and be as efficient as I can with my time.

Obviously I can't learn it all or become a pro but I hoping up to be able to make the leap to backbone and be able to contribute to a few small-scale web apps. As a noob, but at least a competent one!

I can FizzBuzz! Where do I go from here?

Phire — Mon, 06 May 2013 08:26:41 -0800

I am teaching myself how to program. But there seems to be a big gap between intro courses/resources (CodeCademy, O'Reilly books, Learn X the Hard Way) and Actually Doing Things. Help me figure out a road plan? I know HTML and CSS pretty well. I know a teeny bit of PHP and JS and MySQL, and even less of AJAX/JSON, but enough to mess around with existing CMSes and hack together simple custom solutions from StackOverflow and Google. I'm starting to learn Python (I've gone through Zed Shaw's Learn Python the Hard Way). I've also done the Javascript track on CodeCademy, and I'm starting on the "build a search engine" CS 101 course on Udacity.

I'm finding that a lot of the recommended intro resources for these things kind of start off at the same place - basic logic, loops, conditionals, etc. - and then say "Okay, go do stuff". But the stuff I want to do tends to be several orders of magnitude beyond what the intro books have taught. Shaw's book is a good example of this: I can build a CYOA game in terminal! Great. How does this translate to...actually writing a program with a GUI and how do I integrate this with some form of data storage and oh god there's this thing called garbage collection that everyone talks about and ahh.

A lot of advice you see out there is "just start programming!" but I honestly don't even know where to begin. I see cool projects on Github and I can't begin to understand the source code. I also know enough to know that it's really easy to screw things up, and I feel like I don't know nearly enough (or anything at all) about best practices for writing secure code, minimizing run time.

What I'm looking for:
I do really well with structured/project-based learning, which is why the Udacity course seems promising. Just straight-up reading the documentation of the various languages tends to make my brain spin. Can you recommend a guide / a road plan for how to incrementally step up from FizzBuzz to something resembling Actual Skill? Maybe something like Project Euler that isn't quite as math based.

[Extraneous info, possibly useful]
What I'm already doing:

Trying to work on personal projects that are just a little bit beyond what I feel comfortable with. This is fun, but I also can't help but think I'll have a lot of gaps in my knowledge if I only work on things that I can envision, and I can only envision things that are based on the skills I already know.

Reading StackOverflow to see other people's code, posting stuff on CodeReview when relevant.

Slowly (slowly) working my way through the Python Challenges.

What I would like to do with this skill:

Professionally: be a kick-ass web developer. I work as a front-end dev now, but most of what I do is CMS customization (WP, Drupal) and while that is its own niche, it also seems very limited in terms of professional advancement.

Personally: be one of those people encounters a problem / has an idea and can write a script to fix it. This might include stuff like "I need to find a way to integrate RSS content from disparate sources into a uniform-looking output" or "I want to interact with the Twitter API and do cool textual analysis with it" or anything else.

Blue-sky thinking: get to a place where I could build a web-app/service that is actually helpful (or entertaining) for other people. Not because start-up VC blah, but because helping people is awesome. For example, a thing that I'm building for myself right now is a habit-tracker with lots of built-in data-wankery with respects to streaks, averages, trends, etc. It's just PHP and MySQL right now (I haven't gotten to the "graph this data" stage yet) but I could see this being something that people might want.

Happy little (binary) trees. Is there a Bob Ross of coding?

quadog — Sun, 14 Apr 2013 22:28:23 -0800

Is there a Bob Ross of coding? I'm looking for a particular style of educational video which shows developers working through problems. It should include a voice over describing what they are trying to accomplish. It should also show the types of decisions they are making as they work through the problem. I'm specifically interested in Python and javascript. On the Python side, anything that includes data science stuff (obtaining, scrubbing, exploring, modeling or interpreting data). On the JS side, if there were videos on data viz libraries (like D3) that would be good.

Anyway, I get an incredible amount of benefit looking over someone's shoulder as they work. Point me to some learning materials!

Reading to complete before a technical interview (CSS, JS, HTML)?

jsturgill — Fri, 22 Mar 2013 14:15:56 -0800

I'm scheduled for a technical interview after the weekend for a front-end development position. I'd like to spend some intensive time beforehand reading relevant blogs and books to prime the ol' noodle and supplement my existing knowledge. Could you recommend some resources? Are there questions you would ask an applicant in this situation, or that you have been asked? The interview will, in particular, cover "HTML, CSS, JavaScript, and jQuery." The company in question runs on WordPress, so items at the intersection of any and all of those technologies might be particularly helpful. Code will be discussed and produced as part of it.

Please! A real-world application using custom objects in JavaScript.

markcmyers — Mon, 18 Mar 2013 14:18:59 -0800

Coding books give silly examples, like dogs with properties like "breed" and methods like "bark." Can you give me a practical example that includes properties and at least one method—an example that someone would actually use on a real website?

Working with Javascript and Google Fusion Tables...help!

jeanmari — Tue, 12 Mar 2013 19:44:22 -0800

Working on an important open gov data project to support public schools. Need to know how to grab data from a single Google Fusion table cell using javascript...And of course, we are trying to stay up all night because we launch tomorrow. Help?

I want to see what my code is doing

crosten — Wed, 27 Feb 2013 09:43:51 -0800

I am taking an entry-level college class in programming. We are using Javascript "playground" that works within a web browser. I am a visual learner and the textbook and exercises are useless to me. We're only six weeks in and I'm in the weeds. Is there a tool that shows what exactly is happening at each step in the Javascript code? I'm stuck at variables and we're now moving on. I'm afraid that if I don't "get" this, I will be left behind. Specifically, I have an issue with local and global variables and the difference between them. I see variables names being used in functions/modules that are not used elsewhere and it confuses me. I also don't get the passing of variables into functions/modules and how different things come out with different names. Is there a way (video/alternate language, etc.) to visually show what happens at each step?

Ideally, I would like to have two windows: one that shows the code and one that somehow illustrates what is happening in a friendly way, i.e. cute buckets holding the contents of variables and how they are passed around. I know there are programming languages for children. Would they have some relevance to someone learning Javascript?

Help with Tumblr - Can I install this plugin?

Palmfrond — Tue, 26 Feb 2013 14:18:09 -0800

I have a tumblr. I wanted to use this plugin on it, but I am a relative newb in terms of HTML/Javascript, etc, so I don't really even know if this is possible. I asked a friend and he told me tumblr might be "too lightweight" to do this. Is there a tumblr veteran who could walk me through how to do this? Adding insult to injury, it looks like they just changed Tumblr's interface, so I'm having trouble even finding where I can edit this kind of thing. I just feel totally lost, and I'm hoping someone can help me get this up and running on my tumblr!

What are the cutting edge data visualization tools out there right now?

Rodrigo Lamaitre — Sat, 16 Feb 2013 11:42:23 -0800

I am handy with HTML, CSS and a little Javascript. I also have a lot of experience with Wordpress theme development. What is the best path for me to become an ace data visualizer on the web? When I was in university, I got really familiar with building Wordpress sites, HTML, CSS and Javascript. I haven't really kept up with programming for a number of years but historically found myself fairly comfortable with new languages.

I've since become an economist, and part of what I am trying to do is develop a more flexible toolkit for presenting data and text. I like the infographic style and would love to be able to produce articles on the web using that format with relative ease. Ideally, I'd love to build this into existing Wordpress blogs too, but that's not necessarily something I'm married to.

What tools should I be using? Generally, I will be developing my data using Excel or SPSS, so something that is relatively easy to import data and produce stunning charts would be great. On my "god I wish it existed" list would be a tool that would be able to replicate bar charts with importable images - so, instead of a bar that goes to 100, I would love something that would stack, say, a car for every 10 in the dataset (so 10 cars for 100.)

What tools do you think I should be using? I am assuming some scripting will be necessary and I am comfortable with that, but the more out of the box, the better. I have never been good at graphic design so the less of that, the better, unless there's a great guide to get me up to speed.

How do I find web development projects to work on?

MMALR — Wed, 23 Jan 2013 12:51:18 -0800

I was told I can't code anymore, but I love to code. I want to keep up with cutting edge technologies, and while I'm learning -- why not develop projects that people need while getting a part-time income. One problem: Where can I find projects? Right now, I'm currently a project/design lead in the I.T. department of my company. It's a job that is a step below a full-fledged project management professional (PMP). My day-to-day tasks involve analyzing functional requirements, fleshing out the technical how-to, producing design documentation, and handing it off to our development team.

Before I moved up to this level within the company, I was a senior developer with about five years of experience. I was on the cutting edge of technology, heavily involved in molding the architecture of the company.

After the move, it became apparent because it was literally spoken to me that I should not be coding anymore... ever. This came as a shock because I had coded at such a high-level that I was noticed and abruptly promoted to a new position. Fortunately, I've made a smooth transition, and I believe I'm excelling at my current position as well. But I'm worried...

Our company is full of older generation thinking with a sprinkling of a few people who understand that we need to adapt. This is heavily apparent in the high-level, big picture ideas that are produced by our management. Most of it delves far too deeply into the "how-to", and to say that its outdated is an understatement. We aren't cutting edge, and my voice is only one in a crowd of voices simply wanting to get things done versus get things done correctly.

I could go on for hours about that, but that isn't my question. My question relates to the future of my career and acquiring knowledge. I love my job as it is today. I don't want to leave this company, and I truly think that we are heading in the right direction as we have had an influx of younger talent and the older generation is retiring. But I also don't want to sacrifice these years of being told that I shouldn't waste my time on coding. I want to remain a knowledge expert, and I want to ensure that I can find a new job if things go downhill due to poor decisions by management.

So, after my long-winded explanation of the situation... my question is this: What can I do, preferably for some sort of compensation, in the realm of web development that would not only give clients some of my work at a cheap rate, but also allow me to develop with new technologies? Where can I find leads to people who need such work?

I work primarily in .NET, but I've worked in all sorts of modern javascript libraries. I'm definitely wanting to get into developing using MVC frameworks, and I honestly don't want to create something for free for my company if they aren't going to use it. I'd like to create something that somebody actually needs.

What's the best way to find projects to do?

How to divide a div into two triangles with Javascript?

eustacescrubb — Tue, 08 Jan 2013 08:40:41 -0800

Javascript question: I have a rectangular div. Imagine that div is divided from one corner to the other to make two right triangles. I would like to, on hover, have Javascript tell me which triangle my mouse is over. But my trigonometry powers are failing me, and Google is coming up short. Hope me, admin!

How to solve a complex statistics problem with a script?

j0hnpaul — Fri, 30 Nov 2012 18:26:42 -0800

In this game, you roll a number of six-sided dice to get a total. The total is either the highest single die result, or the sum of any multiples rolled, whichever is higher. For example: If I roll three dice and get a 3, 4, and 6, my total is 6. But if I roll a 4, 4, and 6, my total is 8, the sum of the two 4s. What I want to find out is the mean, median, mode, and standard deviation of the possible totals given N dice. How might I create a simple script to compute this? With two or three dice, I can easily figure this out by listing all the possible results, basically by brute force. But that's a pretty labor-intensive method when it comes to four or more dice.

I have a Macintosh, and I'm comfortable using the Unix command line and several programming languages for simple problems, but I'm not even sure where to start automating something like this. I'd be grateful for any guidance.

Looking for an Externally Hosted Image Slideshow for the Web

toastedcheese — Fri, 30 Nov 2012 09:27:49 -0800

I need an image slideshow script for a website. Unfortunately, I'm extremely constrained by our dinosaur CMS. I manage a public library website that runs on a simple proprietary CMS. It turns most inline Javascript into spaghetti and doesn't allow us to upload JS files to our hosting space.

I'd like an image slideshow on our home page to advertise upcoming events and new services. A JQuery carousel would be perfect - I'm not interested in Flash for accessibility reasons and our patrons' browsers are not ready for a CSS3/HTML5-only solution.

The slideshow offered by cincopa.com is perfect - the script is externally hosted and works beautifully on our site. However, our bandwidth needs are too high for the free version, and I'm reluctant to spend money on the pro version unless I know it's our only option, since we won't need the service for long - we'll be transitioning to Wordpress or Drupal next year.

So, are there any free externally hosted JQuery slideshow scripts out there, or does anyone have an alternate suggestion as to how I can accomplish this? I'm a librarian, not a programmer, so forgive me if I've overlooked something obvious.

Safari Bookmark That Controls Scroll Position

boombot — Thu, 29 Nov 2012 14:51:25 -0800

In Safari 6, I have a folder of bookmarks on the Bookmarks Bar that I visit each day by right-clicking and choosing "Open in Tabs". I'd like one of those bookmarks to open to a specific vertical scroll position on the page in question. Is that do-able? I made an inept attempt at doing something via Javascript and found the scrolling to be inconsistent and that an empty, unnecessary tab was created.

javascript:w=window.open("http://www.site.com/"); setTimeout(function() {w.scrollTo(0,1500)},10000);

Im in yr wiki, trackin yr error messages.

supercres — Thu, 29 Nov 2012 14:37:42 -0800

I have a MediaWiki installation on new hardware to replace an old public website. Occasionally someone visits the site using a dead link and gets MediaWiki's "There is currently no text in this page". I can customize the message they get, but how can I get a notification (ideally with Google Analytics custom variables) whenever this happens, without using GA's standard Javascript? This is probably a simple question, but I know very little PHP and even less Javascript, so here we are.

I moved my lab's website to MediaWiki (previously), where all pages are publicly viewable, but only I can edit them.

I have a Google Analytics account for the site, working seamlessly per these instructions. The problem is that I'll occasionally see someone hit the site using an old link, because the MediaWiki page that they enter on is called /~oldlabmember/info.html. I know they're seeing MediaWiki's "There is currently no text in this page." error and getting confused. (Big surprise that there's no page with that name!) I'd like to see when and where this happens so I can put up a redirect on pages where it occurs more than once.

I know that I could create a Custom Variable in Google Analytics that would show up whenever someone hits a certain page and loads a bit of Javascript. I can customize this system message, so I could insert this code, in theory. The problem is that Javascript (which the Custom Variable code uses) is blocked by MediaWiki as a security risk (and rightly so).

I can put the script in Mediawiki:Missing_Page.js or something, but I can't figure out how to only call that when a user hits a "There is currently no text..." page (i.e., not calling Missing_Page.js in Common.js on every single page load).

How do I get around this? An invisible pixel tracking system would work, but I'd really rather not sign up for another analytics account that uses 1x1 gifs for tracking. Moving over ALL the old files from the previous server is even less appealing (especially since I've already moved some into more logical locations on the new server).

Thanks!

Sorting things on the fly in Backbone.js

steinsaltz — Mon, 12 Nov 2012 15:10:00 -0800

Question about sorting in the Backbone.js framework. I've been trying to learn the popular Backbone.js framework for Javascript and am having trouble understanding how it deals with sorting.

I'm making a database of plants. The plants can either be sorted by common name, or Latin name. A radio button would let the user toggle between the two.

Backbone sorts collections of models using a function called Comparator. I can get Comparator to do the default when it boots up...a sort-by-English-name...but am having trouble making it toggle over to a new criteria.

After reading Stack Overflow I gather this has something to do with Comparator being evaluated one time when you start up, and then not being willing to re-evaluate in certain situations. Then there's some other talk about recent changes that have improved the "sort by" ability. But I am still having trouble figuring out the best way to use this.

Could anyone help give me an example of a simple way to make the comparator toggle between two different sort-bys? Any help much appreciated.

Unserializing Wordpress data into JSON

steinsaltz — Mon, 05 Nov 2012 13:12:12 -0800

I'm building a Javascript application that will do cool things with JSON data dumped from a client's Wordpress. It's working great except for parts that are in this PHP-style serialized data that I can't figure out how to deal with in Javascript. Can someone recommend a good method for this? I was excited when I discovered the JSON API plugin for Wordpress, which lets WP produce data that is workable in Javascript applications like the one I am making.

Some of the data is easy to work with, like the "title" field. It shows up as a nice JSON string that I can work with. But many of the other Custom Fields are coming out as serialized data, like this:

"a:1:{s:39:"wpcf-fields-checkboxes-option-154377028";s:6:"medium";}"

I wonder if someone might be able to recommend either a good way of unserializing this in Javascript, or plugging something into the JSON API so that it filters and unserializes PHP before it gets dumped, or a better JSON API for Wordpress that does not do this?

I have been looking around on the Web and saw that there is a function called JSON.Parse that I was trying to use but couldn't figure out how to make it produce the right results or if it was what I should be using.

Any help much appreciated.

JavaScript question

markcmyers — Thu, 04 Oct 2012 09:35:17 -0800

JavaScript question: Here in the U.S. myDate.toLocaleDateString () returns Thursday, Oct. 04, 2012. Can anyone give me an example of the date formatted for another locale?

What is the lowest number and what is the highest number generated by Math.random()?

markcmyers — Tue, 25 Sep 2012 14:41:33 -0800

JavaScript question: What is the lowest number and what is the highest number generated by Math.random()?— 0.0000000000000000 or 0.0000000000000001, 1.0000000000000000 or 0.9999999999999999

My Gut Is Saying "Run" but My Brain is Scared

ohmansocute — Tue, 25 Sep 2012 12:31:38 -0800

I posted this question a few months back but would like to... ask again with a little more details. I bit the bullet and signed up for classes again, and after my first half day back, I'm now at home having a panic attack regarding my decision. I'm a historic preservation graduate student, and after a whole year of freaking out about what I want in life, all I really want is a job that pays well, or an incredibly marketable skill. I doubt I will get either with this degree. I uprooted my partner and toddler to pursue a master's degree that I thought would lead to employability, but after hard core market research and speaking with many, many people, I've realized this is as big of a gamble as going for an MA in art history. I've gone in circles trying to figure out how to make old buildings = money, and have pursued research and internships in construction (with the hope of landing a job with a preservation contractor), and if I continue, will be looking into real estate, business plans, marketing, ect.
But at the same time, I've signed up for a computer science course at MITX, CodeYear through Codecademy, and have applied for a scholarship with Treehouse. My brother is a long time programmer and web developer, and is really motivating me to pursue a career in technology. I believe I would be good at it, and that the things I want in a career (creativity, growth, and a paycheck) are (possibly?) a given with this path. However, if I were to leave my graduate program, I will absolutely not be pursuing any coursework through traditional means (i.e. paying tuition, taking out loans, ect). I just want to know, is this a good idea? Had I been childless and partner-less, I would be less sheepish about changing paths this drastically.

Advice on converting a python program to a web app?

conrad101 — Wed, 19 Sep 2012 05:04:03 -0800

Hi I have programmed on eclipse, a reasonably straightforward program in Python 2.7 that applies image filters to user selected images e.g. by turning them to sepia, black & white, negative, etc. It uses Tkinter for the graphics user interface and the program functions ok. However, I was thinking about how to turn this into a web app. So to transfer this to an Amazon cloud server, I understand that for the client side user interface I would need to convert the program by adding html and javascript to the client side while python handles the server side? Does anyone know of any tutorials or other resources that are particularly good at covering web apps like this using python, html and javascript?

Can you explain why this works in JavaScript?

markcmyers — Sat, 08 Sep 2012 10:19:52 -0800

Can you explain why this works in JavaScript? Someone posted this, saying the variable char will be assigned the value "w"

var str="Hello, world!";
var char=str[7];

Since the variable str isn't explicitly defined as an array, and the characters of the string aren't explicitly defined as elements, I didn't believe it would work. But it does!

Can you explain the syntax to me that makes this work? Is any string variable seen as an array by Javascript?