Programming Puzzle 3: Closures Quiz

by Mike Gleicher on October 22, 2015

in Assignments,News

Due: October 27th

This is a very short puzzle. Think of it as a Quiz. Since we don’t have class on Tuesday, October 27th, do the puzzle in that time slot. It shouldn’t take 45 minutes – but if you don’t get it in 30 minutes, post the first part and see what other people come up with.

Note: the puzzle isn’t just to solve the problem – it’s to understand why the example solution works the way that it does.

The problem:

Write a program that takes all of the buttons on a web page, and changes them so that when they are clicked, an alert pops up that says the number of the button. (so the first button says “1”, the second says “2”, etc.)

The example solution:

Here is a solution that doesn’t solve the problem. Before clicking on the buttons and seeing what it does do, figure it out by reading the code (all 8 lines of it!): http://jsbin.com/pewatov/edit?html,js,output

Part 1: Why does it do what it does?

Part 2: Create a solution that does the right thing. (note: do it with a loop over the list of buttons, don’t hard code it).

Post your answers to the discussion on Canvas. Even if you don’t get part 2, post  solution to part 1.

I am really curious what people come up with. My first solution isn’t as nice as I would have hoped.

By the way, the title of the assignment is a big hint.

Disclaimer: this quiz is inspired by the example on “interviewcake”. Thank you to Michael who pointed me at that.

Reading 7: Review

by Mike Gleicher on October 22, 2015

in News,Readings

Reading for the week of 10/26 (technically, it’s “due” on Monday the 26th).

This reading is a bit of a review… I want you to read something short that summarizes what we’ve learned so far in class. It gives some interesting insights on the basics of JavaScript by discussing it using real CS concepts.

Please read:

JavaScript in 10 Minutes by Spencer Tupping. It’s on GitHub. If you want to go right to the PDF it’s here.

By the author’s own admission, it takes more than 10 minutes to read. I don’t agree with his opinions (that new is awful and prototypes are bad), but it’s worth reading.

There’s no handin, or test. Just do it since you’ll learn something.

Handin Directories…

by Mike Gleicher on October 20, 2015

in News

I noticed that for Puzzle2, no one tried using their handin directory.

Then I realized – it was becuase I goofed! I made a post explaining handin directories, but it didn’t get posted to the news feed. Sorry!

Here are some instructions: link.

In 559, we’re using a similar scheme – the TA wrote a longer explanation.

 

Classroom Change

by Mike Gleicher on October 19, 2015

in News

Starting 11/3, Class will meet in 1325 CS. Same time (2:30-3:20). Just different room.

This week (10/20) we’ll still meet in Noland.

Next week (10/27) there is no lecture.

Programming Puzzle 2 Update

by Mike Gleicher on October 18, 2015

in News

I have updated programming puzzle 2 – I am giving you my “solution” to look at from the start since it will hopefully make the idea of the problem clearer. Please don’t look at the source code until you’ve at least tried on your own.

Grading (or Passing)

by Mike Gleicher on October 18, 2015

in News

Remember: this class is pass/fail.

But, it’s still a reasonable question to ask about grading. There are two different reasons:

  1. You want to make sure that you are passing (it would be bad to fail a pass/fail class).
  2. You want feedback so that you can make sure that you are learning stuff.

This posting is about #1: how we will make sure you’re passing. #2 (feedback) is another whole story. The short answer is, we’re experimenting with using peer discussion and practical assignments so you can assess yourself.

The short version of passing: if you do “most” of the assignments, and do at least a minimal job on most of them, and are not “usually very late”, you’ll pass. Other combinations are possible.

Maybe it’s easier to describe it the other way around: if you don’t turn in at least a minimal thing for 75% of the assignments, you might have a problem. If you don’t at least try to do more than the minimal on the assignments (turn in at least a few working programs, participate in at least some discussions), you might have a problem.

Of course, if you are only doing the minimum, you may have a different problem – doing more than the minimum really is a good way to learn this stuff. The bar for passing is really low.

Some details…

You might have noticed that so far, we haven’t “graded” any of the work in the class on Canvas. This will be changing in the coming week or so (there is a grader helping with the class). Once it’s graded, if you turned something in, you will not get a zero. After it’s graded, it’s too late to go back.

We will be keeping more detailed records than we can relay in canvas (which forces us to use a number for everything). For the reading discussions we will keep 3 scores:

  • Ontime: 3 (yes), 2 (less than 1 week late), 1 (something turned in very late), 0 nothing
  • Submitted: 3 (notable), 2 (acceptable), 1 (unacceptable), 0  nothing turned in
  • More than 1 post: 3 (active contributor), 2 (discussion), 1 (made 1 post beyond), 0 nothing turned in

Note: the grader may not be able to reliably distinguish notable from acceptable assignments. So if you get a 2, consider it “at least a 2”. Since we’re not averaging, it won’t make a difference.

We’ll convert this to a Canvas number (we’ll keep ontime separate): 3 or 4 good (reasonable posting, some additional contribution), 2 barely accepable (posting, but no additional contribution), 1 unaccaptable (minimal posting), 0 = nothing.

We’ll have a similar scheme for the programs. For program 0, it’s “did you turn in a runnable program”. For the puzzles, we’ll look for did you turn in something to begin with, did you get a working program by the end, and were you helpful to others.

 

The week in 638: Week 7: October 19-23

by Mike Gleicher on October 16, 2015

in News,Week in 638

Last week, we had our first programming puzzle, and started to talk about objects. This week we’ll continue that.

For the week of October 19th:

  • We will wrap up Programming Puzzle 1. That means improving your solutions (if you didn’t get it at first, hopefully you did with help. If you did get it at first, hopefully, your solution improved with feedback) as well as giving feedback to others.
  • We will start Programming Puzzle 2. For Monday (10/19) – you should at least start. Be far enough that you can ask a question in class (on the index cards) – and maybe even post an initial solution to the discussion.
  • Reading 6 talks about some places where bad design decisions in the JavaScript language can cause you problems. There’s no discussion. But you’re probably living it as you program, so this may give you some ideas as to how to mitigate the problems.
  • We’re going to start counting how much people have done – expect some “grade” feedback soon. Even though the class is pass fail, you still need to turn stuff in to pass. The number of assignments being turned in is smaller than the number of students on the roster. It is better to turn things in late than never. But you need to turn things in before the grader looks.

Remember:

  • There is no lecture on Tuesday, October 27th. There is a lecture on October 20th.

Handin Directories

by Mike Gleicher on October 16, 2015

in News

For future assignments, we will give everyone directories on the CS file system that will allow you to have your projects “hosted” so that there is an easy way to have a link to your assignment.

For Puzzle 2, using this is optional – but we encourage you to try it out so that you understand the mechanics for later assignments.

The class handin directory is on AFS (so you can access it from any CS department computer):

/p/course/cs638-gleicher/public/html/handin2015

(on windows it’s p:\course\ …)

Within this directory, there will be a subdirectory for each assignment (right now there is on that says “Puzzle2”). Within that directory, there is a directory for each person based on their CS login (not your NetID).

So, for me, there is a directory:

/p/course/cs638-gleicher/public/html/handin2015/Puzzle2/gleicher

And from a Mac or Linux machine, I can transfer my files to that directory with SCP (for Windows, you need a file transfer program. I used WinSCP.)

scp testpage.html gleicher@dolittle.cs.wisc.edu:/p/course/cs638-gleicher/public/html/handin2015/Puzzle2/gleicher

The cool thing about this, is that this directory is served by the web server. So I can see that file with:

https://pages.cs.wisc.edu/~cs638-1/handin2015/Puzzle2/gleicher/testpage.html

If you try that, you’ll see that you need to authenticate to the CS server (using your CS account, not your NetID). This is because we have set up everyone’s directory with an “.htaccess” file that limits access. You can empty out that .htaccess file so that the entire world can see your work.

If you’re a CS student, you should already know your CS account and should be familiar with AFS. (including how to log into one of the CS linux computers and see the directory).

Note: you still must turn things in using Canvas! But now, you turn in a link to the CS server (rather than, say, a JSBin link).

Also, if you turn in multiple versions of things – we would prefer that you do it in a way that keeps the old ones. So, if for a programming puzzle I turned in a first version of testpage.html as above, but then later turn in an improved version, I would call it “testpage_v2.html”. This way we can see that the original was turned in on time, but it will be obvious what the latest and greatest version is.

Being Clearer About Programming Puzzles

by Mike Gleicher on October 16, 2015

in Assignments,News

Maybe I wasn’t clear enough about process – but as we move into the second puzzle and wrap up the first, I should probably try again.

  1. If you don’t get the puzzle at first, you are expected to keep trying – after you see the other solutions, the discussion in class, have questions answered, … Right now, my preference is that you leave your old solution (but say “there’s a newer one below”) and post the newer one separately.
  2. Part of this assignment is to collaborate with others. If you get it, answer other people’s questions and review other people’s solutions. You’ll learn from it – and you’ll give useful feedback to others.
  3. Canvas discussions are not a great mechanism for this. But it’s what we have right now. You can edit your old posts (or reply to them) to say that a question has been answered, or that you figured things out, or that you have a new and improved version.
  4. There is an expectation that everyone should make multiple posts. The first post (either a question or a solution) is just the start. There should be discussions (either helping or getting help), commentary (giving feedback), and revised versions (either making your non-complete assignment work, or your working assignment better).

I have no way to force the collaborative learning aspects. But I am going to try to encourage it.

Programming Puzzle 2: Airline Routes

by Mike Gleicher on October 16, 2015

in Assignments,News

Edit 10/18/2015 – I am giving you my solution from the start, since it may make the instructions less confusing. But try to do it yourself before looking at my code.

Warning – this is a lot bigger than the previous puzzle.

Write a program that…

  1. Allows the user to add a pair of cities (that are connected by a flight). Note: it doesn’t make a difference what order the flight is specified in. (so if I say “MSN <-> NYC” or “NYC <-> MSN” it doesn’t matter – there is an assumption that routes are bi-directional). (better feature: You should prevent the user from adding redundant route.)
  2. Shows a list of all of the direct routes.
  3. Creates a list of cities for which there are routes – as buttons (or some widget).
  4. When you click on the button for a city, it shows all of the places that connect to that city. For example, it could light up everything on the list of routes that was a destination you could reach from the city.
  5. Fancier feature – also show all the things that are two hops. For example, you could use one color to show the directly accessible cities, and two colors to do the two hop cities, …

A few ground rules…

  1. Don’t use jQuery. If you know jQuery already, this will be a good lesson for why things like jQuery are more useful. If you’re able to use jQuery, use your JavaScript prowess in a manner that will be good demonstrations for others.
  2. Simple first, fancy later.
  3. Try first, but then seek help before you get too stuck. This time I will post a (not so great, but functioning) solution before the deadline (but after you had a chance to think about it), so you’ll have at least something to look at.
  4. If you’re stuck – post a question, not broken code. If your bug was easy, you would have found it. Finding someone else’s hard bug is hard. It’s a worthwhile skill to have. But you can’t count on that much generosity from people.
  5. It’s a team effort – the goal is that everyone learns to do it. Just because you got it easily doesn’t mean the “team” has succeeded. I don’t know how to put this into mechanism (I was thinking that your grade requires everyone in your group to succeed, but that doesn’t quite work).
  6. Use good development tools. I was going to say “don’t use JSBin” – but JSBin actually has some advantages (it has syntax and style checking, allows for rapid feedback). I think it’s better to start using some pro-level tools (go see that posting for ideas). I recommend investing some time in learning the tools.
  7. You are encouraged to submit improved versions of your program! If you submit a version that works on the first Monday, submit a better version later. Please don’t delete the posting with your initial submission (although, if you want to edit it to say “this is an old version, look below for the newer one” that might be helpful. If you submit a broken version, submit a better one later. We probably need some better mechanism for turning in multiple versions. But for now, we’ll try to just use postings in the Canvas discussion.
  8. I will post my solution – to each of the group discussions – sometime after Monday (maybe Tuesday after class). So you’ll have at least one to look at. I have posted my solution. Use it to see what is intended. You can look at the code if you get stuck, but my code is ugly. My program is in “my handin directory” https://pages.cs.wisc.edu/~cs638-1/handin2015/Puzzle2/gleicher/airroutes.html (note, like all handin directories, you must authenticate to the CS servers in order to see stuff).

The mechanisms:

  1. I will provide a place for you to host your solutions on the CS web server. We ran into a snag, so I can’t tell you about it yet. Hopefully we’ll have it soon. In your posting, you can post a link to your assignment in this space. Or (for this assignment at least) you can turn things in via JSBin.
  2. Once again, we’ll use a discussion forum on Canvas. It’s not perfect, but it seems to work again. There will be a time by which everyone must have made an initial posting. Then another round of time for help. Hopefully, everyone won’t wait until the last minute before asking for help (or going to provide it).
  3. When we “grade” we will check to see that people really did interact with others. You must make more than 2-3 (good) postings. Asking a good question is a good posting. Answering a good question is a good posting. Giving someone constructive feedback on their program is a good posting. (of course it’s pass fail, so we have little in terms of rewards – but the gratitude of your classmates and the extra learning you get should be its own reward).

The schedule:

  • Initial posting due – Monday, October 19th. By Midnight. Yes, I realize lots of people will do it at the last minute, so not a lot of dialog will happen before class on Tuesday. But, since this assignment is going out late, … The most important thing is that everyone at least looks at the assignment enough that we can play the index-card game again on Tuesday.
  • At least 1-2 iterations after the original – Friday, October 23rd. By Friday, everyone should have “gotten it” – if you got it originally on Monday, you should have ideas on how to make it better – so have an improved version.
  • At least 2-3 comments on other people’s assignments – Monday, October 26th.

For the initial hand-in, I suspect that some people will get it and turn that in. Many people will get stuck – which is OK. When you get stuck, post a question. And come to class with an idea of a question to either ask or write on an index card. Over the course of the week, I hope that the collaborative learning thing will work, and by Friday, everyone will have a solution to the problem. And then over the weekend, you can give each other feedback.

The Canvas discussion thread is: here. Some commentary about how programming puzzles should work is here.