The following is a set of instructions if you are interested in building a website as part of your project. The goal would be to not just have static pages, but move your model into a PERL program and let it execute on your computer using a web browser. This sounds intimidating, but it is easier than you think...
Create a folder called "z-places". Within z-places create "shareware". For each downloaded program create a folder for each program name (e.g. AOLPRESS), that way you can have all the versions in 1 place. Create a folder called "web". If you start to build web pages, save them in the web folder.
It is easier to start a web page fresh / new. Everyone has silly HTML tags that will make your life difficult. If you do start with someones web page you should strip out all the useless tags by looking at the source view of the web page (that is where you see the tags). That will take a while before you can recognize the unwanted tags.
Create a folder on your computer called "shareware" in z-places. Save the download files to this folder. I would also suggest creating a folder for each download. That way when new versions appear you can place them in the same "branded" folder. After you download, follow the individual instructions.
When prompted enter each time requested (you may get multiple requests): username: webdev, password: webdev
Fast Web Site build tutorial I created this a few years ago for my daughter when she was in high school, this is a must view, lots of tricks and tips. Create "web-tutorials" folder in "shareware" then download http://cassbeth.com/webdev/downloads/webdev.ppt (fast presentation on process).
All the work is done on your computer hard drive. The files are just like MsWord except the extension is html. Always use lowercase and no spaces in the names. Use a dash if needed. Possible directory structure for the web site:
z-mywebsite
- dir-1
- dir-2
- dir-n
The files and images go into the above directories. It is important to decide on the directory names because the individual pages will have links with those names and changes will ripple. There are search and replace tools that I have on the download page that you can use if needed. They are really powerful and will make changes of thousands of pages on a web site if needed.
http://www.cassbeth.com/webdev/index.html (this is an old tutorial I gave at L-3)
HTML Authoring - AOLPRESS
Create "aolpress" folder in "shareware" then download
http://cassbeth.com/webdev/downloads/aolp20_32.exe
(web authoring)
Just hit next when prompted, this works on 32 bit vista and XP.
http://cassbeth.com/webdev/downloads/press20.pdf (manual)
For the MAC I only know about a web authoring tool:
http://www.seamonkey-project.org
(when you start sea monkey it looks like a web browser, go to file > edit
page)
HTML Tutorial
http://www.w3schools.com/html
Image manipulation - irfanview you need to convert images to .gif or .jpg, you may have your own favorite tool
Create "irfanview" folder in "shareware" then download
http://cassbeth.com/webdev/downloads/iview380.exe
(image manipulation)
Destination Folder: C:\Program Files\IrfanView (enter when prompted, 1st
screen)
Just hit next when prompted
FTP - this sends your files to a webserver you will not need this unless you want your website on the Internet via UPENN accounts
Create "ftp" folder in "shareware" then download
http://cassbeth.com/webdev/downloads/ftp.zip
(FTP to web server)
just unzip in the shareware > ftp folder
Web Server - XAMPP
You need a web server to run the programs, like your model. If you just had static web pages, you would not need a web server... This has the Apache web server and a PERL library. It has other stuff also... The xampp world is here (it includes versions for MAC also)
http://www.apachefriends.org/en/xampp-windows.html
http://www.apachefriends.org/en/xampp.html
Go to http://www.apachefriends.org/download.php?xampp-win32-1.7.3.exe and download xampp to your shareware folder. Install it right off your C drive so it is located as c:/xampp. At the install window just browse to C:\. Follow all the defaults. The install gets weird at the end but just install on your computer...
After you install xampp, start the xampp control panel from the big round button place. When the panel comes up press the "start" button next to "apache". That will start the Apache web server. It takes a few seconds to go green and say running. Open your browser and surf to location "localhost". If it works the browser will show xampp stuff. When you are done just press the "stop" button and apache will stop eventually.
When you get this far drop me a note and I will describe the next step of creating a web address like "mywebsite" and start showing some program stuff.
This is something you must do...
The framework will take in your values from a webpage that you create, and send out results from your model to a webpage. The generic framework is located at:
http://www.cassbeth.com/webdev/downloads/upenn/analysis.cgi username: webdev, password: webdev
http://www.cassbeth.com/webdev/downloads/upenn/analysis_cgi.txt (the PERL code)
%%%BODY-TITLE%%%
%%%CONTENT-TITLE%%%
%%%CONTENT%%%
This is a simple PERL tutorial. http://www.cassbeth.com/technology/tutorials/perltutorial (press start.html) This is how I got started. Go through it, it is fast.
Then use this as a reference: http://www.cassbeth.com/technology/tutorials/perlmanual/perl-all.html
And when you need really bizarre stuff try: http://www.cassbeth.com/technology/tutorials/perlmanual-1
The way it works
When you press the Submit Query button a custom response window is created and the content is logged in the record.dat file.
1. The template.html file is loaded by analysis.cgi.
2. It is then modified to get the proper response by changing lines that have %%%stuff%%%.
3. Then the new page is sent to the server and pushed to the browser.
Layout of analysis.cgi
1. The first line is a special command that points to the PERL library on the computer. This is part of the web server. The MAC has Apache already installed. There links describing how to deal with the original MAC Apache and the Apache that is part of XAMPP. These MAC links might help if you are still stuck:
http://www.justincarmony.com/blog/2009/02/14/xampp-for-mac-my-frustrations-solutions
http://www.google.com/search?as_q=mac&as_epq=xampp&as_oq=&num=50
2. The next area is the header. The # is a comment marker. I put in an example header. You should modify it. I basically put words in there saying Universities and students can use and do anything. The above stuff is illustration of a more commercial setting.
3. The next sections are more style oriented. I tend to separate the sections by ####################.
4. I put default settings in the next area and end that area by setting a $version variable. I did not do that in this example... I usually use the date, 022010, until I release it to the world. Then I use numbers like 1.0.
5. The next few lines enable debug. If something goes wrong stuff is logged to an error file in the same place the program run.
BEGIN {
use CGI::Carp qw(carpout);
open(LOG, ">>error-cgi.log") or die("Unable to open file: $!\n");
carpout(LOG);
}
Then there is use CGI::Carp qw(fatalsToBrowser); which is a PERL library call that tells the system to print out detailed errors to the web browser when things go wrong. Without it you just get a generic error message.
6. The print "Content-type: text/html\n\n"; line prints to STDOUT (standard output) which is the users browser across the planet. Browsers need the "Content-type: text/html\n\n" text so they know a standard web page is being sent. Without it things will not make it to the browser and the Apache server will report an error.
7. The rest are standard sub routine calls. They are called by using the ampersand then name e.g. &thenameofsubroutine.
8. This ends the "main" section. The rest are the subroutines. Notice some subroutines are commented out. Also notice there is a #print "</BODY></HTML>\n"; commented out. This is all for illustration. Many times I have print statements in the main area that push stuff to the browser. Then the sub routines have print statements. Once all the sub routines are done then we go back to this main area and the final HTML text closing the web page is printed.
The following will describe each sub routine.
&get_date; This gets the date and creates global variables for time and date.
&parse_form; This takes in all the values in an HTML form page. So you need to look at the source of the HTML form page and this sub routine.
The HTML page with a form can be sent using the POST or GET method. In the HTML form pages I used <FORM ACTION="analysis.cgi" METHOD="POST">, which is the POST method. In this approach the URL does not show the variables sent to the server. If I used the GET method the variables would be visible in the URL after I press submit. That means someone could copy that link to an email and duplicate the settings and resend the form. However the GET method is limited to 256 characters. So I used POST.
The values in the HTML page are found in the attribute called NAME. Some of the tags have values that are sent with the submission. Others get the values from what the operator enters.
<INPUT TYPE='hidden' NAME='accttype' VALUE='vendor'>
<INPUT TYPE="text" NAME="address1" SIZE="50">
<INPUT TYPE="password" NAME="pw1">
<INPUT TYPE="checkbox" NAME="ccd" VALUE="CHECKED">
The hidden type is not displayed on the web browser. It is a way to send state information back to the web server. This is how you can use a single PERL program for all accounts. It is also how you can track a login session - for future work maybe. After a successful log in a session ID is created with a timeout. The session ID is in a tag like <INPUT TYPE='hidden' NAME='sessionid' VALUE='142654234'>.
&parse_form; The stuff all gets pushed to a "1 element array", $FORM{$name}. So when $FORM{accttype} is accessed you get "vendor". When $FORM{address1} is accessed you get the address on line 1 the operator entered.
At the end of the &parse_form routine I set all the varaible that the program will use to something that is easier to type and remember than $FORM{pw1}. So I have some examples, but I always pull all the NAME values in all the forms and set them. The 2 examples are:
$accttype = $FORM{'accttype'}; if (!$accttype) {$show = $d_accttype;}
$name = $FORM{'name'}; if (!$name) {$show = $d_name;}
This also allows me to determine if I have confusing or bad NAME settings in the form pages.
&control_menu; This prints out the FORM that allows you to enter data. It could have been a standalone webpage in .html format, but I decided to embed it in the PERL program and use an if-statement to determine if I should send out a FORM entry page or analysis results.
&get_data; This loads a file that has data to be processed by your program.
&results; There are 2 approaches to build a response page to a form submission. The first is to embed print statements everywhere that make the HTML output. The second is to load a template page then modify the template page to get the unique output. I picked the template page approach. The template page is loaded with &get_template:
sub get_template {
$file = "template.html";
open(TEMPLATE,"$file") || print "<FONT COLOR='RED'>Error $! -
</FONT> $file ";
@TEMPLATE = <TEMPLATE>;
close(TEMPLATE);
$ait = $#TEMPLATE;
}
All the stuff is pushed into an array called @TEMPLATE. The $ait has the size of the array. Each line is an array item. So $ait is a count of the lines.
Then I create the unique content using regular expressions (REs). REs let you search for text patterns and other fantastic stuff. This is a link to regular expressions: http://www.cassbeth.com/webdev/regex.html and I stop reading as soon as I see (?#text) in bold. Note that .= concatenates. So I wind up building up text.
Once the content is created then I read the template that was previously loaded into LINES and use REs to replace the %%% items with my unique content:
for ($i = 0; $i <= $ai; ++$i) {$line =~
s/%%%BODY-TITLE%%%/$bodytitle/;
$line =~ s/%%%CONTENT-TITLE%%%/$contenttitle/;
$line =~ s/%%%CONTENT%%%/$content/;
print "$line\n";
}
So I use regular expressions to change the web page line from %%%BODY-TITLE%%% to $bodytitle and so on. Then I print which goes to the STDOUT which is the web browser across the country.
I could have accessed stuff in the array by using the following:
foreach $line (@LINES) {
print "$LINES[$i] ";
}
If I need to use $i then I use the first approach. If I don't need $i then I use the second approach.
&save_record; This saves the record. The >> is used to append to a file. The > is used to overwrite a file. Notice there is a different approach to error on the open. You can use either approach on reading or writing. Rather than create a nice record with an order that I might like to see, I just dump the array that was created by &parse_form:
foreach $setting (sort keys %FORM) {
print LOG "$FORM{$setting}| ";
}
The fields are separate with |, the pipe symbol. When I do this I use the above for debug to dump my inputs, but for log files I enter all the variables in the spots I like.
After this sub routine ends control goes back to the "main" area. Since there is nothing, it just ends.