CPSC 225, Spring 2012
Lab 9a: Not PowerPoint, Part 1

This is the first part of a two part lab in which you will work on a program that lets the user create a series of "slides" (not exactly like PowerPoint, but it's a start). A slide has a background and some text. The user of the program will be able to add and delete slides, move from slide to slide, and edit slides. In the second part of the lab, you will add the capabilities of saving the slide show to a file and opening it again later. You will not turn in anything until after the second part of the lab.

Start by creating a lab9 folder in Eclipse. You will need to add the entire directory /classes/cs225/notpowerpoint (or download a zip archive of the directory here). The files for this project are all in a package named notpowerpoint, so you have to put the entire folder into the src directory of your project.

You have the option of working together in a team of two or three people on this lab. The versions of the lab for two or three people have extra exercises. People working on a project together might want to share that project in a CVS repository. To do that, one of you will have to create a new repository and give the other members of the team permission to access that repository. You need to set up the permissions after creating a new directory for the repository and before initializing that directory as a repository. Let's say that your username is zz9999 are working with two other people whose IDs are xx7777 and yy8888. Then you can set up the CVS repository with, for example, the following sequence of commands:

            mkdir  cvs-lab9
            fs  setacl  cvs-lab9  -acl  xx7777  all
            fs  setacl  cvs-lab9  -acl  yy8888  all
            cvs  -d  /home/zz9999/cvs-lab9  init

Hopefully, you can figure out from that what you need to do. Remember that one person needs to create the project and "share" it to CVS. The other members of the team need to "import" the project from CVS. When you want to work on the project, don't forget to "update" the project to get any changes made by other members of the team, and don't forget to "commit" any changes that you make.

The program already does a significant amount. The main program for the application is in Main.java. You should run it and try it out, and take some time to look through the code in all of the classes in the project. So far, the program only supports one slide. The slide is represented by a variable of type SlideInfo in the SlidePanel class. The menu bar for the program is defined in the Menus class. You will have to work on all three of these classes. There is already a "Background" menu that allows the user to select backgrounds of various kinds for the slide.

(The textures for this lab are free textures from http://www.grsites.com/archive/textures/).

Exercise 1: Multiple Slides

Your first assignment is to make the program work with multiple slides. So far, there is a single slide, represented by a variable of type SlideInfo in the SlidePanel class. You should keep this variable, but you should add a variable of type ArrayList<SlideInfo> to the SlilePanel class. This variable will hold all the available slides. You'll also need an int variable to store the current slide number; this int variable is an index into the ArrayList.

You should add a menu for working with slides. To add a menu, you need to work in the file Menus.java. The menu should have commands to: Go to the next slide; Go to the previous slide; Go to the first slide; Go to the last slide; Insert a new slide (after the current slide); and Delete current slide. (You might also want commands to insert a new slide before the current slide, or one to add a new slide at the beginning of the list of slides.)

Note that when you move to a new slide, you have to update the currentSlide variable and the current slide index, and call display.repaint(). Calling display.repaint() ensures that the contents of the currentSlide are shown in the panel. Also there is a JLabel message at the bottom of the screen that is meant to show the current slide number. When you change slides, you should update that message. All menu commands for modifying slides apply only to the current slide, as given in the currentSlide variable.

Exercise 2: Text Items

Your second job is to make it possible to add text to the current slide. The text will consist of a series of text items that are drawn in the central part of the slide, leaving a border of at least 30 pixels around that area. There should be two types of text items, headlines and list items, which will be drawn with different sizes of text. In addition, text items can have different colors and different font styles. The font styles can be represented by the styles already defined in the Font class: Font.PLAIN, Font.BOLD, Font.ITALIC, and Font.BOLD+Font.PLAIN.

You will need to store information about text items in the SlideInfo class. Since there can be several text items on a slide, you will need to work with ArrayLists. A nice way to do it is to define another class, named TextInfo, to hold information about one text item. That information includes the string of text itself and properties such as color and style and whether the item is a headline or a list item. You can make a new, independent class, or you can make it a nested class inside SlideInfo. In any case, you will need an ArrayList of TextInfos in the SlideInfo class.

You should add a "Text" menu to the menu bar. It should have a "New Headline" command and a "New List Item" command. You can get the text for the item by calling

String text = JOptionPane.showInputDialog(owner,"Enter the text:");

This method returns null if the user cancels the dialog. Otherwise, it returns the text entered by the user. Note that the text can be an empty string, if the user pressed "OK" without entering anything. You should ignore both null's and empty strings!

The text menu should also contain commands for changing to a different color of text and for changing to a different style of text. You can use a single "Custom color" command, or you can use a color submenu, like I did in the Backgroung menu. For the text style, you need four commands, either in a submenu or in the text menu itself: Plain, Italic, Bold, and Bold+Italic. (Consider adding keyboard accelerators for these commands.) These commands always apply to the last text item in the current slide. If there is no text item in the slide, then the commands should be ignored. You might want to add a command for Deleting the last text item.

Recall that fonts are represented by the Font class. A font is created by constructor call such as

Font f = new Font("Serif", Font.BOLD, 24);

Then, the font can be used in a graphics context g by calling g.setFont(f). The third parameter in this constructor gives the font size; 24 is about twice as large as normal. You should use different sizes for headlines and for list items. The style should depend on the style chosen by the user for the text item. You might want to create all the fonts you need at the start, rather than making a new one every time you need it in paintComponent. When drawing strings, I would indent list items a bit, compared to headlines, to make it more clear that they are subordinate.

The first item in the Font constructor is the basic font face. You might want to give the user a choice of "Serif" or "SansSerif". See Section 6.3.3 for more information on fonts.

Extra Exercise for a Two- or Three- Person Team

In addition to the preceding two exercises, a two- or three-person team should make it possible to mark a line of text with an "emoticon". By emoticon, I mean one of the small face images in the package notpowerpoint.emoticons. You should add a sub-menu to the text menu that contains the emoticons from this package. (You can use file names or icons or both in the menu. You should check what I did with the texture background images to make the Texture sub-menu of the Background menu -- except that you can use the emoticon image directly to make an icon; you don't need to make a smaller sized image.) When the user selects an emoticon from this menu, it should be added to the current text item. The emoticon should be drawn to the left of the text, just like the circular black "bullets" that you see in many lists. You will have to add information about emoticons to your text information.

(Emoticon images are icon images from the Gnome Desktop project, which is distributed under the GNU Public Licence.)

Another Extra Exercise for a Three-Person Team

In addition to all preceding exercises, a three-person team should implement "transitions" between slides. That is, when moving from one slide to the next, you should play a short animation that shows the old slide being gradually replaced by the new slide. The easiest way to do this is to use a Graphics2D "transform." You will have to ask me to show you how to do that. Hopefully, you already know how to do animations with Timers; if not, you should ask about that too.