Web page maintenance
Contents
- Projecting the Web Pages
- BSpace
- Maintaining the Web Pages
- Version Mangement
- Editors
- Viewing Your Local Files
- Equations and Symbols in Web Pages
- Committing in your changes under Cygwin2>
Projecting the Web Pages
Many of the web pages under "topic notes" are useful to project
in the classroom. If you choose to do this,
you should copy the web pages onto your laptop (e.g. using CVS,
as explained below).
To get large enough fonts to use in the classroom, on your copy,
you can copy the file css/UCB-classroom.bak.css
to
css/UCB.css
.
To restore the original fonts, copy css/UCB.bak.css
to css/UCB.css
.
Be sure to not check in the classroom-specific UCB.css
file or the on-line web page will also acquire large fonts.
Using BSpace
Maintaining the Web Pages
These web pages are designed for easy customization by the instructor. They use frames and cascading style sheets so that a uniform look to the web pages is maintained without relying on each person editing the page to follow some style guideline.
If you check material into the eecs20
cvs repository, then you should assume it will appear on the web.
Version Management
Using Subversion to update this page
See How do I update workgroup pages using SVN?
Once you have an account and access, you can check out a tree with:
svn co https://repo.eecs.berkeley.edu/svn/projects/ealprivi/eecs20/
Other Repositories
In January, 2011, we moved a bunch of the files from previous years out of the eecs20 repository. This was done because the repository was becoming very large. Below is a list of repositories:- The eecs20 repository
- The
eecs20
repository contains the website.svn co https://repo.eecs.berkeley.edu/svn/projects/ealprivi/eecs20/
The old cvs repo was in/home/eecs/eal/repository
- The instructors repository
- The
instructors
repository contains the solutions. To get access, seehttp://chess.eecs.berkeley.edu/instructors
.
Note that this repository is onrepo.eecs
.svn co https://repo.eecs.berkeley.edu/svn/projects/chess/instructors/trunk/instructors
- The old Lee & Varaiya book repository
- The
leevaraiya
repository contains the book sources for the book athttp://leevaraiya.org
.
Note that this repository is onbennett
.https://repo.eecs.berkeley.edu/svn/projects/ealprivi/leevaraiya/
The old cvs repo was in/home/eecs/eal/repository
- The old eecs20 repository
- The
eecs20old
repository contains old files that were moved out during the January, 2011 cleaning.
Note that this repository is on the departmental server in /projects/ptolemy/eal/repository.cvs -d :ext:moog.eecs.berkeley.edu:/home/eecs/eal/repository co eecs20old
For the above to work, you need to either be eal or be in a unix group that has read access to/projects/ptolemy/eal/repository
Updating the EECS20 website
To update the eecs20 website, you must be an admin in the eecs20 workgroup on chess. See the eecs20 overview for who is an admin and can grant admin permissions.
See How to update the EECS20 site for the next step.
Editors
Do not use Microsoft Word to edit the web pages. It corrupts the HTML in subtle ways and makes maintaining the web pages much more difficult. Note that if you use Microsoft Internet Explorer and select Edit from the File menu, it opens Microsoft Word to edit the web page. Do not do this!
If you know HTML, an ordinary text editor is sufficient for most purposes. A much more sophisticated interface is offered by Macromedia's DreamWeaver. If you use this, please exercise restraint with fonts and colors. The class web page needs to have a professional and uniformly low-key look. The default styles provided by the style sheets are the preferred formatting.
Emacs Notes
Emacs has some useful features if you set up your account so that run cvs commit without typing in your password:Control-c Control-q
- This command toggles the read/write bits of a file and if
the file is under Subversion, then it will invoke Subversion and bring up
a buffer for you to type in your log message.
When you are done with your message, typeControl-c Control-c
, which will then send the change to the Subversion repository.
Note that for this to work you must be able to runsvn commit -m "xxx" foo
and not be asked for your password.
Note that the svn server on repo.eecs.berkeley.edu does not support ssh. The svn server on repo.eecs is using the https:// protocol, not the svn+ssh:// protocol. Various svn clients optionally stash your password in various ways, consult the documentation for your local client.
Viewing Your Local Files
The EECS20 website uses Server Side Includes (SSI). Files such aseecs20/index.html
has lines like
<!--#include virtual="/eecs20/ssi/toppremenu.html" --> <!--#include virtual="/eecs20/ssi/menu.htm" --> <!--#include virtual="/eecs20/ssi/toppostmenu.html" -->(Note that there is no space between the
<!--
and
the #include
.)
SSI allows us to to have the menus in one file and include it in each html file. Unfortunately, this makes it difficult to view the results of editing.
The solution is to set up a web server on your machine and view the website locally.
Macintosh: Setting up Apache to use SSI
Happily, Mac OS X includes Apache, which only needs to be reconfigured slightly for SSI.- In the Finder, go to
/Applications/Utilities
, and start up a Terminal. - Go to the apache2 directory:
cd /private/etc/apache2
- We will need to edit a file owned by root. I could not get
the default editor, "TextEdit" to work, I recommend using
TextWrangler
or
emacs
, - Edit the
httpd.conf
file:open -a /Applications/TextWrangler.app/ httpd.conf
- After the
<Directory "/Library/WebServer/Documents">
insertXBitHack on
What this does is enables SSI for any HTML files that are executable. See http://httpd.apache.org/docs/2.2/mod/mod_include.html#xbithack and http://httpd.apache.org/docs/current/howto/ssi.html. - In the same
<Directory "/Library/WebServer/Documents">
section, add+Includes
to theOptions
line. ChangeOptions Indexes FollowSymLinks MultiViews
toOptions Indexes FollowSymLinks MultiViews +Includes
Below is the section ofhttpd.conf
file with the edits:<Directory "/Library/WebServer/Documents"> XBitHack on # # Possible values for the Options directive are "None", "All", # or any combination of: # Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews # # Note that "MultiViews" must be named *explicitly* --- "Options All" # doesn't give it to you. # # The Options directive is both complicated and important. Please see # http://httpd.apache.org/docs/2.2/mod/core.html#options # for more information. # Options Indexes FollowSymLinks MultiViews +Includes
- Save the file, you will be prompted for your password because the file is owned by root.
- Move your copy of the
eecs20
tree to/Library/WebServer/Documents/eecs20
:mv ~/src/eecs20 /Library/WebServer/Documents/
- In System Preferences -> Internet & Network -> Sharing, select Web Sharing
- Point your browser to
http://127.0.0.1/eecs20/
If you have problems, try stopping and restarting the web browser by unchecking and checking the Web Sharing check box.
Also, try using the Applications/Utility/Console application to view the /var/log -> apache2 -> error_log
Equations and Symbols in Web Pages
When these pages were first developed in 1999, the equations and symbols were, at best, a black art.
For example, to get the set membership symbol, Î, in 1999 we used to use
<FONT FACE="Symbol">Î</FONT>However, the above works only under Windows and not under Mac OS X. Under Mac OS X, the Symbol font is not present and instead we get a capital I with a circumflex.
Happily, the solution is to use Unicode, see
List
of XML and HTML Character entity references page on wikipedia
or search for "unicode html entities
".
To get the set membership symbol ∈ on all platforms, use
∈
For the subset operator ⊂, type this: "⊂" without the quotation marks.
For the superset ⊃ "⊃".
For intersection ∩ use: "∩"
For union ∪ use "∪".
However, the resulting web pages will not render correctly on 1999 era browsers.<.p>
Below is a list of alternative equation and symbol technologies and why they have problem.s
- Gif images. Translators from TeX to HTML currently create gif images for all the symbols. This is only barely acceptable. The images do not scale if the user changes the font (or if you change the font to project the page in class). Also, when printed, the gif images look terrible.
- Symbol font. On Windows platforms, there is a Symbol font
that includes all the Greek characters and many mathematical symbols.
Using this font results in non-portable web pages, but they look
good on Windows machines. They print well and scale well for
projection in class. This is the method we use in these web pages.
For example, to get the set membership symbol,
Î, use:
<FONT FACE="Symbol">Î</FONT>
Of course, you have to know that "Î" in the symbol font is the set membership symbol, which is virtually impossible to know. The only way seems to be to use Microsoft Word, which then (regrettably) corrupts the web pages in various ways. (By now, you are thinking this is one big joke...) A better way is to use Word to find out how to translate the various symbols to HTML, and then code them into DreamWeaver as "library items." The directory "Library" on the website (and in the CVS repository) has a bunch of these library items encoded by their LaTeX representations. The problem with the/Library
is that it is non standard and broken. It is better to use the HTML character entity references. - MathML viewers. There are a few available MathML viewers. Typically these work as applets within your web page. They are too sluggish for more than occasional use. Eventually, however, MathML will probably be rendered by standard browsers, and LaTeX to MathML translators will be available (you do not want to write MathML directly, unless you really like to type).
Committing in your changes under Cygwin
If you change a file, use cvs commit to check your change in
cvs commit -m "Fixed a typo" index.htm
To add a file, use
cvs add yournewfile.htm cvs commit -m "new file" yournewfile.htmWarning: By far the most common error is to edit an existing file to make it refer to a new file, but to fail to add the new file. Please avoid doing this; the resulting broken links will annoy the students and future instructors. Be sure to add any new files that you refer to. Also, if you add a derivative file, such as a PDF file, be sure to add the source file (LaTeX file, Word file, etc.). Otherwise, someone will end up redoing your work when that file needs to be edited.
Warning: If the file you are adding is a binary file (GIF file, Word file, FrameMaker file, etc.), you must use the -kb option when adding it or CVS will corrupt the file. You will likely lose the original, and nobody else will be able to access it. To do this, say:
cvs add -kb filename cvs commit filenameTo update your local copy after someone else has checked in changes, say:
cvs -d -P updatein the appropriate directory.
The-d -P
flags will create any new directories and prune empty directories in your copy of the tree. Or, you can create a ~/.cvsrc file that containupdate -d -PNote that the -d incvs update -d -Pis different from the -d incvs -d :ext:... co eecs20
cvs update -d -P
will print a very cryptic
list of the status of each file. The first character in each line
is the key:
- ? - Means that the file has not been checked into CVS.
- M - Means that the file has been locally modified and not committed
- C - Means that the file has been locally modified and that someone else has made conflicting changes. You must edit the file and look for conflicts (marked with >>>>>), fix them, then commit the file.
- U - Means that someone else has modified the file and your copy is being updated.
- P - Means that someone else has modified the file and your copy is being patched.