Scripting Languages Midterm

  1. This exam is a take home exam. It is due Friday, Oct. 2 at 4:00pm.
  2. Submit your answers using the 460_submit or 594s_submit scripts.
  3. Each problem tells you the name of the file in which you should place your answer.
  4. I will test your answer with sample input so try to make sure your answer works. I will award partial credit if your answer does not work.
  5. You must answer all of the questions.
  6. Don't waste time trying to come up with the most elegant answer possible. Remember that the point of using a scripting language is to write a program as quickly as possible.
  7. Good luck!

  1. (12 points, table.html) Create an html table and internal stylesheet that displays the following three gif files: 1) bvz.gif, 2) quetzalc.gif, and 3) mammoth.gif (these gif files can be found in ~bvz/cs460/exams/midterm). The html table should have the following characteristics:

    1. it has a collapsed, 2 pixel wide, black border.
    2. it has 2 columns with the headings "person" and "beast". The headings should be colored blue and appear in an orange background color.
    3. The bvz and quetzalc gifs appear in row 1
    4. The mammoth gif appears in row 2 and spans both columns
    5. The gifs should be given the following widths:

      • bvz.gif: 140 pixels
      • quetzalc.gif: 200 pixels
      • mammoth.gif: 200 pixels
    6. All the gifs are horizontally centered and vertically aligned with the top of the cell.
    7. There is a 10 pixel padding around all gifs.
    8. The gifs have the captions "Brad Vander Zanden", "Quetzalc", and "Wooly Mammoth" respectively. The captions should appear horizontally centered under their images. It is okay to use a paragraph tag to separate the image from its caption. You do not have to use nested tables.
    Your table should resemble the following one:

  2. (10 points, layout.css) Create a cascading style sheet that will create a page with the following characteristics:
    1. a one-column banner across the top of the page. The banner should appear in a div block named banner and it should:

      1. span the entire width of the page.
      2. be surrounded by a solid 2 pixel, black border.
      3. be bold-faced.
      4. be 150% of the default fnt size
      5. have a padding of 20 pixels in all directions
      6. have a margin of 20 pixels between itself and the columns that follow it.
    2. a 180 pixel left column with a background color of orange. The column should appear in a div block named leftbar.
    3. a right column that occupies 20% of the page and has an orange background color. The column should appear in a div block named rightbar
    4. a middle column that absorbs the remaining space between the left and right columns, and whose content does not flow under either the left or right columns if its content is longer than the left or right columns. The column should appear in a div block named main

    A sample layout using your stylesheet might appear as follows:

  3. (14 points, format.css) Create a cascading style sheet that will create the following visual effects:
    1. Code blocks displayed with the pre tag will have:
      1. a background with a color mixture of rgb(212, 212, 212),
      2. a dashed border with a pixel width of 2,
      3. text displayed in a blue font, and
      4. padding of 10 pixels around the entire block.
    2. The background color for the document will be pink
    3. Paragraphs with the class name quote should have a left and right margin of 30 pixels.
    4. Strong faced words that appear in paragraphs with the class name quote will:
      1. use the font Arial, with a backup font of Sans-Serif,
      2. be colored orange,
    5. Content that appears in the span element named "def" will be:
      1. italicized,
      2. colored red, and
      3. appear in a 12 point font.
    6. Items that appear in unordered lists that are nested inside of an ordered list will:
      1. appear with a square bullet.
      2. have a hanging indent of 10 pixels.
    A sample document using your stylesheet might appear as follows:

  4. (14 points, forms.txt) Suppose you are designing a reservation system for Brad's Luxury Suites and Penthouses hotel. For each of the following scenarios, pick the most appropriate form element to use from the list below:

    textboxpassword boxtext area
    hidden fieldsubmitreset

    1. The user should enter their income range, and the possible ranges are: 100000-200000, 200000-500000, 500000-1000000, 1000000-10000000, and 10000000+.
    2. There should be a promotional code that is not visible to the user
    3. The user should enter which country they are from. There will be about 150 countries from which to choose and we do not want the user to be able to enter an incorrect country.
    4. The user will be asked to choose which of the following services they wish to utilize: massage, exercise room, pool area, game room, laundry, internet, dog walker. The user may request more than one service.
    5. The user should enter the names of any accompanying children.
    6. The user should enter an alias by which they wish to be called. We do not want someone looking over the user's shoulder to be able to read the alias as the user types it in.
    7. The user should be able to press a button to complete their reservation.

  5. (30 points) This problem tests your ability to write Perl regular expressions and substitution patterns:

    1. help.perl Write a Perl regular expression to determine whether a string variable contains the word help! at the end of the string. The regular expression should match the string "I need help!" but not the strings "I help! brad" or "I needhelp!". In other words, there should be at least one whitespace character before the word "help!". Read the string from the command line and print "yes" if the string matches the pattern; otherwise print "no".

    2. alpha_num.perl Write a Perl regular expression that matches any string that begins with a sequence of one or more alphabetic characters and ends with a sequence of one or more numbers. For example, the pattern should match "bvz64", "bvz! 64", and "bvz64 fo3", but not "87", "brad" or "bvz64brad". Read the string from the command line and print "yes" if the string matches the pattern; otherwise print "no".

    3. replace.perl Write a Perl substitution expression that performs the following substitution on all occurrences of either opening or closing html tags in a string. It should replace the < sign with the characters #* and the > sign with the characters *#. For example, <strong> should become #*strong*# and </strong> should become #*/strong*#. Your solution should assume that multiple tags appear in the string. Read the string from the command line and print the altered string.

  6. (10 points, tail.perl) Write a Perl script that prints the last 10 lines from stdin. If stdin has fewer than 10 lines than print all the lines from stdin. A blank line is considered a line.

  7. (10 points, max.perl) Write a Perl function named find_max that:
    1. takes two arrays, e.g. array A and array B, as parameters
    2. compares each pair of elements from the two arrays, e.g. compare A[0] with B[0], compare A[1] with B[1], etc.
    3. returns one array containing the maximum element from each comparison. If one array is larger than the other array, then the excess elements from the longer array are the default maximum elements.
    For example, given the two arrays:
         array 1: (cat, fred, smiley, ebber)
         array 2: (joe, dog)
    your function should return the array:
         (joe, fred, smiley, ebber)
    After you write your find_max function, place code into your file that:

    1. reads the two arrays from the command line. The words in the two arrays will be separated by a #. For example:
      perl max.perl cat fred smiley ebber # joe dog
    2. calls your find_max function, and
    3. prints the result. For example:
      joe fred smiley ebber