IntroductoryLab: Getting Started

Introduction to Computer Program Design: Introductory Lab

days Due 8 Sep 7pm

To Submit

  • Modified version of NameTagPrinter.java
  • The Experience.txt file with a short answer to the question.

Summary of the introductory lab

There are six parts in this introductory lab.
  1. Navigating the COMP102 web pages:
    right Make sure you can access information on the COMP102 web site, including the files you need for your assignments.
  2. Using the online questions:
    right Practice using the online questions for this course, by doing the 3 practice questions.
  3. Using the web-based submission system:
    right Make sure you can submit your assignments for this course.
  4. Running BlueJ:
    right Make sure you can run BlueJ (the Java program development environment you will use for editing and running Java programs) by running NameTagPrinter.java inside BlueJ, editing it to make the name tags different, and then submitting your edited NameTagPrinter.java file.
  5. Solving a programming puzzle:
    right Run the MazeMouse program, and get the mouse out of the maze. This is a good thing to do with the students next to you.
  6. Extending your java program:
    right Add some new features to NameTagPrinter.java. Again, work with the students next to you.

1: Using a browser and accessing the COMP102 web site

rightStart a browser.

To access the COMP102 website:
  • Type in the URL https://ecs.wgtn.ac.nz/XMUT
  • From the table in Semester One, select COMP102
  • Or, type in https://ecs.wgtn.ac.nz/Courses/XMUT102_2024T2/

tip You will need to access this page a lot so add it as a bookmark.

right Look through the course home page to see what is there.
  • Weekly timetable, showing the times of the lectures, labs, etc;
  • Course schedule, which is where you can access copies of the slides from the lectures;
  • Assignments page, with links for each assignment

right Look at the Assignments page and find the online version of Introductory Lab (this lab). Find the link near the top of the lab exercise for downloading a zip file of all the files needed for the lab exercise.

For each lab and assignment, we will provide such a zip file.

right Download the zip file now and unpack it to your home folder.

The browser may just save the zip file. If so, you will need to open it to unpack all the files. Alternatively, the browser may automatically unpack all the files. Either way, you should end up with a folder called IntroLab in your home folder containing the files you need. Make sure that it contains two folders called NameTagPrinter and MazeMouse, and a file called Experience.txt.

Note: You can do the same thing from your home computer to download the files to that computer.

To find out how to run Java and BlueJ on your laptop or home computer, look at the JavaResources page (click the JavaResources link on the left panel), and then click on the Using Java and BlueJ at home link. This has instructions for how to set things up.

2: Using the online questions

Every Pass/Fail (P/F) assignments has an online part that you must complete in order to pass your assignment. This is a number of small problems based closely on the content taught in the videos and class. When you attempt an assignment, you get immediate result/feedback. You can attempt them multiple times (unlimited), but you must successfully solve each problem before the assignment deadline.

Go to the Online questions now and answer the 3 practice questions for this Introductionary Lab.

tip There is a link to the online questions from the left menu.

3: Submitting your answers

Every Pass/Fail (P/F) assignments has a programming part that you must also complete in order to pass your assignment. In that part, you will have to write your code in a Java file, make sure it compiles and executes, then submit the file using the online submission system.

right In your web browser, go to the top of the Introductory Lab page, and click on the "To Submit" link. It should look something like this:

submission.png

The submission page will let you upload your files to the submission system, where the markers can access them. You may re-submit the same file as often as you like, but the submission system will only remember the latest version of each file.

right Use the "+Upload files..." button, then navigate to and select the NameTagPrinter.java file, (which you downloaded in a previous section). Once you have uploaded the NameTagPrinter.java file, it should look like this:

submitted-file.png

Notes
  • the green line indicates that the file was successfully added. If you click on the Submission logs button, you will also notice that your file is recorded as being uploaded.
  • the green tick next to the name NameTagPrinter.java in the Assessment Info panel shows that you have submitted one of the required files.
  • The Submission System displays the New Zealand Time. You just have to remember your assignments are always due at 7pm China Time.

submission-required-files.png

If you accidentally add a file the submission system does not accept, e.g. NameTagPrinter.class, the line will turn red as in the image below:

failed-add-file.png

tip The error message helps you identify what the problem is.

right Finally, when you have submitted all the required files, click the "Run checks" button. This will run automated checking of your submitted files that we have set for each assignment.

As you have not yet met all the requirements of this introductory lab (you still need to add the Experience.txt file), you will see the following image. Note this contains instructions on how to fix the submission.

complete-missing-file.png

Even if the "Run checks" button results in an error message, the files you have submitted have still been accepted - you can see a list of all the files that you have successfully submitted in the "Submitted Files" section (and you check them by clicking on their names).

Open the Experience.txt file using a file editor (for example TextMate), answer the question with a short line, and submit the saved version of the file. Click on Run checks. Your checking process should succeed and you will be presented with the following screen. Note how the box surrounding the "Run checks" button has now turned green and shows the time of your completion.

successful-complete.png

Note, if you don't click this button, you have still successfully submitted the files - they just haven't had the automated checking and you cannot get a receipt

The "Submission Status" area can show in three different colours:
  • red indicates that no files have been submitted. If you have submitted some files and then deleted all of them, the "Submission Status" area will turn back to red, indicating there are no files to be marked.
  • blue indicates that some files have been submitted but the Run Checks has not been run on this set of files, or you have not yet submitted all the required files, or the Run Checks found an error. (For comp102, this means that some files did not compile.)
  • green indicates that all the required files have been submitted and the Run Checks process has reported no error. (For comp102 this indicates that the files have compiled. It will list the files it has compiled.)

If you decide you want to change a program after submission, you should submit it again using the same process. You can resubmit files as many times as you wish --- your latest submission will be treated as the real submission. This means that you can submit your program earlier in the week when it is only partly done, and then submit it again later when you have got more of it finished. This a good way of checking that the submission process is working.

4: Java and BlueJ

This section of the introductory lab will lead you through just the first steps of using BlueJ to write Java programs.

Java is the programming language you will use in the course, and BlueJ is an application that allows you to construct, run, and debug Java programs.

For this lab, we will go through the steps of using BlueJ to run a program, and make minor changes to it.

Opening a Java program with BlueJ

A Java program consists of one or more files containing Java source code; these files must have names ending in .java

BlueJ has a "project" for each program that you are working on. A BlueJ project is a folder that contains all the Java files for the program, along with any data files the program uses, the class files that the compiler creates (which is what the computer actually runs), and several other files that BlueJ creates itself. When you download the files for an assignment, any Java programs should already be organised into BlueJ projects. Check that your IntroLab folder contains a folder called NameTagPrinter; this is a BlueJ project.

To work on a Java program, the safest way is to start up BlueJ and then open the project for that program from inside BlueJ. You may also be able to double click on the package.bluej icon in the project folder, but this doesn't always work.

right Start up BlueJ.

right Open the NameTagPrinter program from inside BlueJ using the "Open Project" option from the "Project" menu, and navigating to the NameTagPrinter folder.

This should open a window like the following:

bluej-nametagprinter.png


Editing, Compiling and Running a Java program

The NameTagPrinter program displays a name tag in two different ways. The program is very small and contains just one Java file: NameTagPrinter.java

BlueJ displays each class in the program (each class corresponds to one Java file in the project) as an orange rectangle.

If you right-click on the rectangle for a class, it will pop up a menu of actions that you can perform on the class or its file: including "Open Editor" (to read and edit the program) and "Compile" (to compile the file). If the file is compiled, then there will be additional actions.

right View the NameTagPrinter.java file using the "Open Editor" command. Note you can double click on the rectangle for the class to activate the "Open Editor" command.

It should open up a new window with the Java program code. The NameTagPrinter program has three methods, each of which have a sequence of actions. Read through them and try to guess what they will do. (The "UI" in the code refers to the user interface window where the programs will read and print text and draw shapes.)

Before a Java program can be run (or "executed"), it must first be "compiled" (ie translated) into Java byte code - a form that the computer can execute. The compiled form is stored in files with names ending in .class

If a Java file has been compiled (and is therefore ready to be run), BlueJ will show the corresponding rectangle in the project window as plain orange; if it hasn't been compiled, it will have diagonal shading on it.

right Compile the NameTagPrinter.java file, by right-clicking the NameTagPrinter rectangle and choosing Compile, or by clicking the "Compile" button on the left of the project window.

The rectangle should turn plain orange.

It is possible, that the ecs100 library file has not been installed. If so, BlueJ will complain that it can't find ecs100. To fix this,
  • Click on the Tools menu,
  • Select the Preferences option,
  • Click on the Libraries tab.
  • Click on the Add File button
  • Navigate to the folder where you unpacked the IntroLab zip file
  • Select the ecs100.jar file (click it then click the Open button)
  • Click the OK button (which will pop up an information box)
  • Close and restart BlueJ
  • Try compiling the NameTagPrinter again.

Now you can use BlueJ to run the program. To run a program in Java, you have to create the program object, so the first step is to make a new NameTagPrinter object.

right Right click on the NameTagPrinter rectangle, and choose the new NameTagPrinter() option. When it asks for the name of the instance (the object), just click "OK".

This will create a new red rectangle at the bottom of the BlueJ window representing the new NameTagPrinter object.

bluej-nametagprinter.png

right Right click on the new red rectangle at the bottom of the BlueJ window, (the NameTagPrinter object), and select one of the actions:

bluej-nametagprinter.png

right Choose the void drawNameTag() option.

right Now do it again, but choose the void printNameTag() option.

There is also another way of running this program using buttons:

right Choose the void setupGUI() option.

The program should put some buttons on the window.

right Click the buttons. Do they do what you expected?

You now know how to run a simple Java program using BlueJ.


Modifying a Java program

You should now modify the program to make it behave a bit differently. To change the program, you need to go back to the editor window with the code. If you closed it, open it again by right-clicking on the NameTagPrinter rectangle (the orange class, not the red object).

right Now modify the program so that it says "Hi I'm" on the name tag instead of "HELLO, my name is". You can change either (or both) of the printNameTag or drawNameTag methods.

right Run the methods again to check that your modifications were correct. Note that you will need to compile the program again before you can run the methods.


You now know the basics of running and editing a simple Java program using BlueJ.

right Close BlueJ.

right Submit your modified version of NameTagPrinter.java. Make sure that you submit the .java file.

5: Solving a programming puzzle

This part of the introductory lab is optional, and only if you have time. It involves working out instructions (ie, a program) for a mouse that is trying to get out of a maze. The MazeMouse program (part of the zip file you downloaded and unpacked) will let you try out your mouse instructions. You can watch a short video of the MazeMouse program to help understand what you have to do.

right From inside BlueJ, open the MazeMouse program using the "Open Project" option from the "Project" menu, and navigating to the MazeMouse folder. (You may have to restart BlueJ if you closed it. You may also want to close the NameTagPrinter program if it is getting in the way; BlueJ is happy to have two separate programs open at once, but it tends to get confusing.)

right Run the MazeMouse program by right-clicking on the MazeMouse rectangle and choosing new MazeMouse(). Right click on the MazeMouse object and choose the void setupGUI() option. [Note: the video runs the program in a slightly different way.]

You should now see a simple square maze with a mouse in the top left corner. You can modify the maze by clicking on squares to change walls to spaces and vice versa.

The basic actions of the mouse are to move forward (" F "), turn left (" L "), and turn right (" R "). Your program for the mouse will consist of sequences of these basic actions. For example, the sequence " FFLF " would make it take two steps forward, turn left, and take one more step forward.

The mouse is very short sighted and can only see the square ahead of it and the squares on each side. It can distinguish five different situations:
  • Space ahead: There's a blank space ahead of the mouse (it ignores what's on each side)
  • Space only on left: There's a wall ahead of the mouse, and to its right, but a blank space to its left.
  • Space only on right: There's a wall ahead of the mouse, and to its left, but a blank space to its right.
  • Space both sides: There's a wall ahead of the mouse, but blank spaces to both its left and its right.
  • At dead end: There are walls ahead of the mouse and on both sides.

You have to give the mouse a sequence of actions to perform in each situation by typing in a sequence of F 's, R 's, and/or L 's in each of the white boxes in the left hand panel. For example, you might want to make it take two steps forward when there is a space ahead, so you would type one FF in the "Space ahead" box.

You can then make the mouse follow your instructions using the "Step" or "Run" buttons.

Your goal is to find a set of instructions for the mouse that will enable it to get out of the maze, whatever the shape of the maze! You can assume that the mouse always starts in the top left corner of the maze (the "Restart" button will put the mouse back in the corner). The obvious instructions don't work, so you will have to think more carefully! Once you have some instructions that seem to work, try changing the maze to check that it still works correctly.

right Get in a group of three people to discuss your ideas for solving the puzzle. When you come up with a possible program, try it out, and try to find a way of "breaking it" - changing the maze so that it won't work. Can you get a program for the mouse that will work on any maze?

6: Extending your java program

(Optional - only if you have time)

We haven't covered very much Java in the lectures yet, but you should already be able to use the ideas from the NameTagPrinter program and the TemperatureCalculator to extend the NameTagPrinter program in several ways.

right In small groups of three, work on the following changes:
  • make it draw a larger rectangle;
  • draw the name tag as a circular button;
  • make the name tag have a coloured background;
  • make it draw two nametags (a button and a desk nameplate) next to each other;
  • make it ask for name and school, and put both on the nametag.
  • make the name tag have an image in the top left corner (you can copy an image from anywhere to get this).
  • make the name tag be the right size for the name - longer names have wider name tags (you may need to find out how many characters are in the name!)
  • make the program ask the user for the width and height of the nameplate, and draw the nameplate with a rectangle that size.
  • make the fontsize of the name be 1/4 of the height of the nameplate, (whatever height the user entered).
You may need to look up the documentation to work out how to do these things (there is a link to JavaDocumentation on the sidebar of any of the COMP 102 web pages).

Afterword
There are several important links at the bottom of the course home page:
  • Change password, lets you change your password on the ECS computer systems (which are also needed for accessing the online questions and the submission systems from home).
  • Read the advice about password security and phishing.