A Study in Database Driven Web Development through the Creation of the BSU ACM Website http://www.cs.bsu.edul-acmdev an Honors Thesis (HONRS 499) by Andrew Neville Thesis Advisor Kathleen Keil Ball State University Muncie, Indiana May 2004 Graduation; May 2004 " , ;" Abstract In the last few years, dynamic web design has started to become the norm on the Internet. Having the skills to create an effective dynamic website is essential for any up and coming web developer. This project is intended to help me learn those skills and the concepts behind them. A major portion of the project is a dynamic database driven website created for the Ball State University ACM. The other portion is an analysis of the process in which the creation of the site took me through. This includes what was required, problems encountered, and what was learned from each of what I consider to be the three steps in dynamic website construction, design, development, and coding. Also included are early rough draft site designs, a database design schema, and site structure chart. Acknowledgements -I would like to thank Mrs. Kathleen Keil for advising on this project. She was extremely helpful with design ideas and brainstorming features -I would also like to thank ACM President Trey Gourley for his cooperation and support in the creation of the site -Lastly I would like to thank John Neireiter for his proofreading and editing work. In today's wired world, a presence on the web can be the key to accessing millions of customers. Everyone on the web is trying to sell something. Some are selling a good or service, some themselves or their organizations, and yet others are simply trying to get the viewer to buy into the idea that the information or data they provide is true and accurate. But no matter what you are selling, the key to doing it successfully is to provide a website that makes people want to return. Dynamic Database Driven Websites One of the most common ways of getting people to return to a website is to have consistently fresh and new content. This is where the use of tools like database technology and dynamic server side scripting languages such as ASP and PHP can make the world a whole lot easier for the web designer. Keeping a website updated with fresh and new content does not necessarily in itself require these tools. For many basic web sites, updating can be as simple as changing a few lines of text on a page. Consider this: What if one simple update of a site required the changing of data not on one simple page, but on hundreds or thousands of pages? The task of updating the site by hand just became a huge hassle. This is where a dynamic database driven web design comes in. Dynamic websites do not have all hard coded pages. The majority of their pages are instead created on the fly as the user requests them. Therein lies the biggest difference between dynamic websites and static websites. A static page holds the data that is to be shown to the user, while a dynamic page holds the information on where to retrieve the data. For example, someone's static personal website may have their name and address in the lower right comer on each page, so they can be contacted if need be. 1 What if that person's address changed? He/She would be forced to go into every page on their site and change the address listed. In a dynamic website, every page would pull that address from a database or file and display it each time a user requested a page. Updating the address is as simple as going into the database or file and changing it there. Then each subsequent time a page tries to get that information, it will contain the new updated address. This is an overly simplified example, but it shows in clear-cut terms just how advantageous dynamic websites can be. My Creative Project For my creative project, I chose to do a case study in dynamic database design through the creation of a website for the Ball State student chapter of the Association of Computer Machinists (ACM). Through this study I wanted to learn the basic principles in the design, development, and programming of a dynamic database driven website. In the end, I wanted to have knowledge of how to effectively create this type of system, and also have a website for the ACM that could be easily maintained and updated. Target Audience The target audience for this project is for the most part the ACM student members here at Ball State. The site's audience could also include alumni, faculty, potential students, national ACM members, and others simply interested in the organization. My intention was to design the site so that computer savvy people would find it appealing, but the lay person would not find it too complex and shy away. 2 The Process As I stated before, for this project I wanted to focus on the three major steps in the creation of a dynamic database driven website: design, development, and programming. For each phase I would like to go through a little bit of what was involved, how I went about doing it, some of the problems I encountered, and what I learned from the process. Design The design process for a web development project, such as this one, is an alwayschanging entity. Throughout the entire project creation you are constantly making changes to the design and tweaking it to make it just a little bit better. The design process for this particular project really can be broken down into two parts: the look and layout of the site, and then the features it contains. The design of the look and layout of the site is of considerable importance when trying to create a successful website. If your design is too basic, you may not be able to show all of the information you need. If your design is too complex, viewers might be confused and turned away. The trick is instead to find a place somewhere in the middle, something complex yet easily understood. As I learned, this is not always an easy thing to achieve. I started my design process by sketching rough draft mock-ups of the site on scratch paper. I have included these designs in my project submission. Early on, my ideas were very basic and did not have any creati vity to them. As I started to settle more and more on elements of the design I liked, the page really started to come together. By the completion I feel as though I came out with a design that is both creative and usable. 3 The design specifically entails a logo on the top, with a menu navigation system directly below it. That header is the same on every page, giving the user a common interface in which to operate under. Under the header is each page's individual contents, centered in the user's screen. On each side of the contents, there is a dark grey shaded area. While this area may at first seem of very little importance, it actually plays a vital role in the design. When a website is viewed, the designer knows little about the environment it is being viewed in. One of the major obstacles to any web design is the way it looks on a monitor in different screen resolutions. The dark grey shaded area in my design expands and contracts based on the viewer's screen resolution, allowing the design to stay the same no matter what resolution it is viewed in. The second major portion of the design of the system was deciding on the features it would include. Dynamic scripting languages allow for a plethora of features to be added to a website. Through discussions with the ACM officers, I settled on a few features that I thought would not only be extremely useful to the organization, but also help me learn the most as well. The first feature I chose to add was a news section. The news section allows for the ACM officers to post relevant news directly to the front page of the website. My goal was for no HTML coding to be necessary. All the officer would have to do is enter some information into a form and press a submit button, and the information would be posted. The second feature was an events calendar. This operates in a similar manner to the news section. Again I wanted no HTML coding to be necessary. Instead, the 4 infonnation could be submitted via a fonn, and the corresponding date would be highlighted in the calendar. The third feature I chose was a mailing list. This is a simple concept, allowing the user to enter an email address and click the submit button. Their email address is then added to a list in the database, and they will receive subsequent ACM mailings. The fourth and final dynamic feature I chose to add was an administration section. This feature was absolutely necessary to control who posts new events, news, sends out mail to the ACM mailing list. All four of these features are common to dynamic database driven websites. Each one uses a table in the database to store infonnation when it is submitted, and then retrieves it each time a page is accessed. Throughout the entire design process, I learned one very important concept: no design is ever perfect and complete. There is always someone who thinks that the design would look better another way. There is also room for improvement, no matter how nice the initial design is. Even as I left the design phase and entered the other two phases, I was constantly going back and working on the design, trying to make it look just a little bit better. Development What I consider to be the development phase of this project is the setup of the site structure and database. The site structure I chose is nothing all that special or innovative. When the mouse is hovered over the menu at the top of the screen, that section is expanded giving more page options. I have included a site structure chart along with my project submission. 5 The design of the database was something that took a little more time. A database consists of many tables. each of which has fields (or columns) inside of them. Without getting too technical. I had to design each table and the fields that it would contain, including their data types and lengths. I spent quite a bit of time studying different data types and how best to optimize the retrieval speed of the database access. The database program I chose was MySQL. While there were other options out there I could have used, MySQL is a free database program, and it is also offered by the Computer Science Department to any CS organizations or students who want database access. Since I had never used MySQL before, getting acquainted with its commands took some research on my part. CodingIProgramming The third and final stage of this database driven website's Iifecycle was the actual coding of the dynamic pages. The creation of a dynamic website can be done in a variety of languages including ASP, PHP, JSP, PERL, and others. In the development of most dynamic sites the designer has a choice of which scripting language to use. Because the ACM website that I am creating will be on a CS server that only supports PHP, it was my only language that was feasible. Many of the specific coding techniques I used are beyond the scope of this analysis, but there is one in particular that I would like to mention. It is inevitable that someday the ACM will want to add new pages onto this site that I have created. To make this job easier, I created functions that can be called to create the shell of the 6 webpage, called tope ) and bottom(). They can be used in the following manner: tope ); //information you want displayed on the page, can be dynamic or static bottom( ); By calling the corresponding functions before and after your page information, the new designer will place his information in a template that will give it the same look as all of the rest of the pages on the site. In almost all programming, you run into many problems and hang-up points along the way. While I had my fair share of those during the programming process, I was able to find solutions or workarounds to all of them. As I worked through the coding process, I quickly learned to effectively code in PHP. Being new to the language, my first attempts resulted in inefficient code that I ultimately went back and replaced. An Easily Maintainable Site Not only did I choose this project to teach myself dynamic database driven web design, but, in the end, I also wanted the website to be something that could be easily maintained in the future by other ACM members. One way this can be achieved is through the creation of the tope ) and bottom( ) functions, which I have already mentioned. I also provided complete documentation within the code itself (known as commenting in the CS realm). This documentation should help anyone who seeks to modify the code in the future to better understand it. Along with the documentation, I also had a meeting with the ACM officers and gave them a demo of the site and how to maintain it. I feel as though where I have left the site allows for someone with prior knowledge of PHP and MySQL to come right in and make any adaptations or additions they wish. 7 Personal Thoughts Overall, this project has taught me an incredible amount about dynamic database driven web design. I learned an entirely new language, PHP, and a new database administration program, MySQL. PHP is an amazing language. It has many nice features that are included, and I would recommend it to anyone interested in dynamic web design. I also think MySQL is a tremendous free database tool. It already has become one of the industry standards and I can see why. While PHP and MySQL are great things to know, I think the biggest thing I will take away from this project is the overall process that dynamic web design includes. I learned exactly what goes into a website that could be considered minute when compared to some others such as Yahoo! or Amazon.com. I designed everything on this site from the layout to the graphics to the code. There is a tremendous amount of detail that goes into each one of these things that I did not imagine. The best part about these concepts that I learned is that they go beyond PHP and MySQL. They can be applied to any of the web scripting languages and any of the database administration tools. I learned concepts that I can carry far beyond just the life of those two tools. Conclusion Through the creation of the Association of Computer Machinists website, I have learned how powerful dynamic database driven websites can be. The Internet has not yet even reached its stride as an information medium. In the future, I see dynamic websites and dynamic web design becoming more and more of the rule on the Internet. The skills I have acquired in this project definitely give me ajumpstart into what I believe will be the wave of the future on the Net. 8 Bibliography Converse, Tim, and Joyce Park. PHP Bible. Indianapolis, Indiana: Wiley Publishing, 2002. Dyer, Rusell J.T. Adding & Changing Data in MySOL. March 2004. Unix-Review. <http://www.unixreview.comldocuments/s=8989/ur0403k1>. MySQL, Official Site. <http://www.mysgl.com>. PHP, Official Website. <http://www.php.net> Powell, Thomas A. The Complete Reference: Web Design. Berkeley, CA: McGraw Hill/Osborne, 2002. Tips, Tricks, How-To, and Beyond. <http://www.tips-tricks.com/>. Thibodeau, Serge. How to Optimize a Dynamic Web Site. 13 May 2003. Internet Search Engine Database. <http://www.isedb.comlnewslindex.php?t=reviews&id=21l> . Ullman, Larry. PHP and MySOL for Dynamic Web Sites: Visual Ouickpro Guide. Berkeley, CA: Peachpit Press, 2003. Yohng, George. Accessing MySOL from PHP. <http://www.yohng.comlphpm/phpm.htm>. Rough Draft Site Design Mock-ups -t ~~11c1~ --~ ~ La-'h~\ - N~<.l.s ~ ~ /'V"'"" ~ IV""" \ A..- ~ ~ A[M I I ~\ ( V{X-flWlIV\~ £vtllb ~ ~ ~ ~ .l~ -.. . . ----.------J I! 1! --'k. ., g..u sI,l;~. __ - lJii /f.A",1,.- ---._ ---- ._--PMl.. /JIVtc,s-ty ... ••. $fA4e ... ----.--.-------•.-........---" .. .,-------.-~--- ,---- ~- .. -. ~ \ 1 " \ L ~ If ,\ i ! f O~--bD==-;:-""_.==J._ J:::L::=L --------------1 LCl..~t~~ hl!l~ ~ ~ ~ ~ ,AA oti tJ..s I ~ /~ ~. ~"I -(~''5> -/0 J.I -i s ,'k. I -l. ~M"l r .. "_. ~:> I -~\.~ 3.[0.D", . ~ .~ ~ -+-" ~ .. " - --~ 5. Cl'\. OIP "'30.. ~.~ , ~). \ -- -, . - --- - , --_. _.- - - . ---- , 1 ~~ ~~iIi:lp l'b1iA\..o;,l- --, - - - .. -- _ - ... --- -l~ ., , -----i.I -----+----i--~ - - - - - - - - - ; - - - - - --------- ---- r-- ----------- - r---- -- - ------ ----~_r--------~~~---------_+----_+---- -- ----~-- --- - - - - - - ----------------------------------- Database Design Database Schema Events(EventID int(6) Primary Key, Title varchar(255), Date date, Time varchar(20), Info longblob); News( NewsID int(6) Primary Key, Title varchar(255), PostedBy varchar(l5) Foreign Key, PostedDate int(20) , Info longblob); EmailList(Address varchar(40) Primary Key); Admins(AdminID varchar(l5) Primary Key, Password varchar(50), Email varchar(40»; Database Layout Events News EventID Title Date Time Info NewsID Title frm!?d!!y PostedDate Info M 1 Email List Admins Address AdminID Password Email Site Navigation Structure Chart Public Section IndexlMain About the ACM Join the ACM Join ACM.org ACM.org SIGS Features Contact ACMInfo Constitution Digital Library Meeting Minutes Officer List EYents Calendar Member Directory Picture Gallery Message Board Mailing List Site Screenshots Special Note: Due to the nature of this project, I will be handing over control of the website to the ACM once this thesis has been submitted. I have included as many screenshots as possible in order to show exactly what the site looked like upon my completion. Andrew Neville IndexIMain )1. II ,tol. lin', I 1111. File Edt View FII~ortes I ) I I, Tools 111,,1 I" 11 )' II _ ' = : [J·a ACM General Meeting --Posted by AmI!IllJ. on 5.4.2004 ilt 1:40am This meeting "Iill be the spring elections for Ball Stau.s ACM. The positions tll"t lire e~"il"ble are president, vice-president, lind secretary/treesurer, The secretary/treasurer position is stetBd in the constitution as one person, but the position hils been held by two people before. I would elsa hke to elect III chair position to oversee the AeM coding contest for 2004, This posrtlon would lert until November and ",ovid be m ch<lrge of handling details reQardmg the eall State~ partici"ation 1[1 the codin\! contert. Last LAN Party of the Year --Posted by ~ on 5.4.2004 at 1:39am This is back by popular demand. This will be the last official ACM event for the Sprin<;< Semester. If you are interested In attendm<;< please reply to thiS email. If you know someone who may be Interested, forward this emaIl to them. There WIll be p,zza and pop. erin" $5 just in case we h~ve to buy hu<;<e amounts offood. Games of choice: Enemy Territory, Unreal Tournament, and you may talk me Into playing some St<!lrCraft. As always, if you have any questions please emaIl me at acm~cs.bsu.edu or go to the messaQe board at http://cs.bsu.edu/~acmlboud , lOID tbe Mailing LIst ACM Spring LAN Party --Posted by .A.m.H.iIle. on 5.4.2004 irt 1:25am We oIIre lucky again to have this YMrs LAN Pllrty in the Student Center. We will be plllyinQ the free version of Enemy Tarriteu. ThiS is a greilt teilm based game, This "arne has a hIgher hilrdware reqwrement thiln iln ilvera"e lIilme so .... e 1'0111 also ha~e CQIln!'J'!r Strik" .. nd ~ avail"bl~ "Iso. If you lIIIould like to jOin the fun the price is $5 dollers to cover the food, Email "MlaN bSII "rill tO~S!lIn up or for more information. , ~ta:1 ';It I .:i I ) " xl • Help ~ A ( I, I Ei 5' .. : iii"",,,; Last LAN Party of the Year ··Pltsted by amuIIIJ.ltn 5.4.2004 at 1:3Bam n." I> back by ~o~ular d.mond, Th" wIll be tho last off,CIal ACM e •• nt 10' tho Spnng S.m..,., II you In"" .... d In .... ~d'"~ pl •• se repl) to thIS e",ail. II you know somoone .. ho mOf II. Inte''''od. fo"".rd til" omOl1 to 'h.m. Thore WIll be P'U$ .nd pop B'lng $5 Ju<t In 0... " . h~ •• to b"y ~Vg. ~movnt. 01 food. Gome. 01 dlo,c" Enemy Temtory. Unre,1 Tournoment •• od )o~ m., tolk me jnl<l pl.,'n~ some SI~,Croft $'. ,<. A••1... If you ~ •• e any QU&.~on< pi ..." "'M.I 'M ot .",,"1P0. b.u.odu 0' go to the m"".~" boa,d.t http,l/o •. bsu .• du/~.cm/bo.nj ACM Spring l AN Party ,-PA_d by amuIIIJ. on S.4.l004 <It 1::lS."" We.re lucky .gom to h •• e tim yM" LAN Po", on tho Student C~nte, W... ,II b. play,ng tho fr •••• , .. "" of Foom. Tomtpo Th"". ~re.tte.m b.,ed ~.m~. TIm ~ome ~M' ~Ighe. h •• d",.re r.~ulrementthon.n . .e"Q. gom •• o .. o ",II .1'0 h.'e ~ ond WJ.ift ""I.bl••1'0. If ,ou would I,k. to )o,n the fun th. ono&" $5 doll." '0 COVO, tho lood. Emad IgnP" hil 0411 to ,,~n "p v' lv, mvr. ,n/Orm.tlon " I I II Last LAN Party of the Year --Posted by AmIltlIII. An 5.4.l004 at 1,38am TI1i. i. back b1 populor d~m~"d, Tho< .. ,II b. th. I~st offocl.1 ACM e •• nt fo' tho Spnng Some""r. If you .. ~ Int.,e,ted on ottenoln9 ple.,e ,eply to th" .",~,1. If you know someono who m.y bo ,no:er." .. d, to"",nj 'h" em.il to them. Thero ",dl bo P"" ond pop. BrI"Q $5 Ju,t in "",e "'" h~.e to buy hu~e .mounts oftood. G.me. of ehOlC8' Enem, Torri,or" Unro.1 Tcum~m.nt, ~nd IOU m.y talk me Into plaYing .om~ S!4rCr.ft As .I... y., If YOU h •• ~ ~ny qu •• tio~. ple6 ••• m.il m • .ot acmOc<,b,u.ed" oc go to t~e mO"'g. bo.rd .t htt,c :lIcr .b." ."duf~.cm/bo •• d ACM Spring LAN Party --PAsted by AmIltlIII. on 5.4.2004 at 1:25am ..... e .... lucky ~ooln to h ••• thIS yeo" cAN P.ot, ,n tn. Stude", Center. We ""II be pl')ln~ the m,e .e",on 01 Eo!oo. Drrjtpry ThIS i. 8 ~reot te~m b •• ed ~~me T~i. g.me h6> • hi~he' ~$nlw~.e req",,,,ment thon on a.ecog. gome <0 "'. ""ii ~I'Q hay. ~ .nd t1Ilt.I.ifl ~.~il~bl •• 1'0. If IOU ",ould hke to jOin th. fun tI1e price '" $5 doll." 10 co~.r tho food. Email agnPR< b. .d'! to "gn up or for mo,. informMlon About the ACM ) loll File tol Edt II \'iew I ," F<MIrtes • I "l' Tools 10 I, I 11,·t 1'1,1., I Help The ACM W~< founded ,n 1 g47 a, the SOClety of the oomputlng Mmmunlty The purpo<e< Clf the A«ocoatJon, a< .tat~d If) the ACM ConroMlon, are: 1, To advance the science. and art, of information proce."n~ jndudjn~, but not restricted to, th~ study, de~i~n, de~elopment, construction, and appllcatlon of modem machinery, comp~jng tect.ique~ and ~ppropri.te lang<J~g~< for .. ener~1 Inform~t,on proce<<lng, f~r $CI~nbt.c CQm~~Qn, for th~ recognition. ~II kind>, and for the automatic ",,!"!1To1 and .imulatian of <""rage, ,etneYal, and proce •• m\l of data of processes, Z 3 To promote the free int~rchanQe of informabon about the ,e.ence. and art. of information pron •• m~ both amon~ speciali.t. and among the public in the best scientific and profo •• ional tradition, To develop and m~lnt~m the InteOnt1 and competence of indl~,dual. enQaQed tn the practices of the 'Clancs. and arts of InformatIon proce .. in~. [Con.titution of the AS'Ocldtion for Comp~tin~ Mac/1iner1, ArtIcle III Sinc~ Its form~tlOn, the A«ociat,on for ComplJtmg Machiner~ ha. pro~lded o~~r a quarter of " cenbJry of oervlce to the computing profe ..lcnal,n the de~elopment of computer SCience, curricula fcr eduC<1tianal pro~r~m$ in computlnQ. ~ code far prof~H,on ..1 conduct, ~nd d~fln'nQ ~nd e:<pl",n,nQ the role of computers In madun s<)c,et¥. ACM keepo both it. member. ~nd the Qener~1 public Informed on curr~nt h~pp~nlnQ' in eomputlnQ .. nd computer sCience by pubhshlnQ o~er tllienb Journals, many newsletters, monoQr~ph~ ... nd spon~orm~ numerous meetmgS regul~rly org~nized on tOP;C<1I, regIonal, .. ndlor nation .. 1 b ... es, The ACM today ha, mor~ th~n 65,000 members. Th,rty"t",o ,peci~1 ,nterert "roup, and tec/1n1c~1 committees such~. SIGPLAN (the Speci~llnterest Group of ProgramrrHno Lanou~oe.), Ad~TEC (technl",,1 committee on the ne", IMgu~ge, Ad~) ~nd SIGGRAPH (Spe"'~1 Interest Group on computer Gr~phlc,), .er~e the p~rti"'-'I .. r ,ntere,t. of ACM members and others in many ~rea. of computer .cience and technolDgy, Over 100 local chapters serve the needs of members at the local level trou~houl the ",orld. ApproxJmately 13,1l1lO sttJdent5 p .. rt,oop"te In the actlv,tie. of the A55oclatlon, many trough the .. ctlvltle, of .tudent ch~pter< ,n over 400 coll~ge. and unlver.,tie. worldwide ACM Member5hip _ ,:- X • .Join the AeM • Cont~ct !h~ • O. lU'\ ACM ot tgoO." bi! ,d, , come to tt>. next meeting There are two typs, of m.mb.,"h.~., local a~d national. l..oo.1 membersh,p ... co $5.00, are I"noted to • period of one yeo" and grant >otlng pny,leg., fur ACM office" and allow part,c'p.tton ;n chapter sctwiM<. r.ld~on.1 Student memborsh,p, ,.ngo from $18.00 to $60,00, depond,ng on opbon. d"lred, ~.-.rrt ¥ot'n~ pnviloges for ACM off,oe,..., 4nd allow P4rt,oop.bon ,n ch.pl"r ~ctI"'tle. !f 'ow or. a !>Iabon.1 Member membo, ro<ls. olre.d~, ple.se ~ your m<mpe"h,p number 00 we can .dd 'ou te tho Constitution Constitution of the Bodl Stilte University Student Chapter of the Association For Computing Machinery (OCTOBER 1974) ("'mended MAY 1999) ARTICLE I: Name ",1ty Stud.nt Chapter of the A.. oco.t,on for Section 1, Th .. organlZatlor. <hall be called tl\e Soli SUIte un, .. Com~utlng M4<htnery. ARTICLE II: Purpol>e S"ctlOn 1: Tho Chapter" and," furtherance or~an«ed and w,lI be operated e~clu.,v.ly foe eduootlonal .nd .",.nMe purpo,e' tI1er.~f. TO promote an ,ncrun of knowlod ... ,n!h. 8'03< of <OIMCO, de"9n, d~ .. lopment, construction, 1~"'~U'~6'. and in the area at appl,.;.otions of mode_" computing machinery To promote an in"", ••• of interert ,n <O",puMa rtlaeh'Mry ~nd it, ~ppll<&tlon. To ~n:mde ~ mean. of communiubcn between peroon< <h."nQ a common Intere,t In computlnQ b m~ch'n.rl ARTICLE III: Membership Section 1: Regular Member<h,p in tho< Chapter .hall be Ilm~~d to .11 Momb.", ~.so",ato Membo", and Student Members of the liteM who ore studerots, faculty, or staff of eall Stoto uni."r<ily and .. ho al,o m.et any lurther quall/le.t'o", ""at may be .p~cmed in the Elylo"". Ragular Mamb." .ro entitled", "t. Section 2: ..... oo •• t. Memb""h.p m thIS Chapter sholl be I'mlt"d to all Mambo'., A.so",.te Members. ond Student Members 01 the AeM who are rMident. otthe Mea ,ervlced by Ball State Unovor.,ty ilnd ..no also meet any further ~w.lih~atoons thet mu be .pecolied In the Bylo",., A.. ocoata Member, are entitled to vot" , <;1<11 '0: j :l • < ~ Events Calendar < . start rOi j t 1 \1 IV (JII I ) EI • ~ < I I 1 Picture Gallery Mailing List ACH Mailing List Syh<qjbelllns!lb<9nbe t9 th. 8CM Mf! no ! Ii! • start,1> ~ :) ;.f •• < Officers Faculty Sponsors - Mrs, Gall Green & Mrs. Kathleen Kell President - Trey Gourley Vice President - Joe Morns Treasurer· Chns Noland - Arshls Khan < Slilft 'il -'.i J ' .• ( Member Directory " Jul,e !l"nkm~n /lIn Chalmers George D",d,on Andre. Dep.lm. K.~ln Dunn Marco Fernnl MMk Groy Trey GourleY Josh Hamman. Ne,1 John,on Md'J Meado ... ' Josh M.hl.r Rob Mo~r¥ Andrew Nevill. Tim Nolon ~.ek P~g.c Budl W,bowo Ch.n9ho Y~ng J,hG Ydn~ Shen York start -. .cI :l .' .• ( ~ Administration Login " Administration • stan.., .;l ) -' •• ( Administration Home Administration Add New Event " Add New News Post 0 Mailing I is! Opnons ~ Add New Admlo!strator • starr.. .:J :l .• < ~ Add New Event Add New Event plene Enter the Ev"nt Inform.tlon ... , start 1Il j :l . .• ( ~ Add New News Post , <:;tart.\! ..:.I :J c' •• ( ~ Mailing List Administration File EclI: View FaI'OI'hs Tools • ~ View Majling L jst r<> v.e .. the current ",eM Ma,hng lJ<t I ClickHer9 I Send Mail to the ACM Malmg ljst I , start N. .:..I SandM1I11 ) _, •• ( ~ New Administrator + Pi" ..... New Administrator Creation l'''u~ Ne. Adrnlni.t.tor lnf .. nn.tion ",y-",,'p,'\," ,Lc; ,'#;; Confirm P..... ord • start" .:.I :l . • < M Code for Dynamic Portion of the Website <? 1* Name: AddEvent.php Function: Allows for a user to add an event to show be show in the calendars within the site *1 include~once ( II • / includes/var .phptt) ; Ilchecking for authentication if ($_SESSION [ 'userID' ] ==" " ) ( Header ( "Location: login.php"); else ( top() ; I l i f stuff has been posted, then process, else show form ?> <!-----text for main cell--------------------------------------------------------------------> <div style=lIposition:absolute; width: 655pxj top:Opx:text-align:left;1I class=lttextl1> <div style="margin-left:15px; height:700pxj 11> <br> <table valign=llcenter ll > <tr><td style="padding-right:l0px;"><img src="img/srnallacmlogo.gif" width=40 height=40></td> <td><span class=lItitlell>Add New Event</span></td></tr> </table> <BR> <? if ($_POST [ , success' ] ==" submi t ted" ) ( $Title=$_POST['Title'] ; $Date=datetosql($_POST['Date']) ; $Time=$_POST['Time']; $Info=$_POST['Info'] ; ereg_replace ( 11 \n II ereg_replace (" \r" $Info $Info ( I , I "<br>" I $Info) $Info) ; i Ilgetting news information $generate = "INSERT INTO Events (Title,Date,Time,Info) VALUES $Ti tIe' I $Date' , I $Time', I $Info ') j 11 ; I $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); mysql_query($generate, $db); echo "<span class=\"posted\">Event Successfully Added<!span>"i else ( ?> <1----------------------> <table border=O class="text ll > <tr><td colspan=2 style=lIfont-weight:bold"> <center>Please Enter the Event Information ... <BR><BR></center> </td></tr> <tr><td> <form name="addevent" method="POST" action="addevent.php"> Title:</td><td><input type=lItext" name=l1Title ti class="text" size="60" style~"background-color:#CCCCCC;"> </td></tr> <tr><td class="text"> Date: </td><td><input type="text ll name="Date" size="15" class="text" style~"background-color:#CCCCCC;"> <a href="javascript:show_calendar('addevent.Date') i" onrnouseover="window.status='Date Picker' ; return truei ll onmouseout='lwindow.status=' 'ireturn truei 1I><img src="img/calendar.gif width~24 height~22 border~O style~"vertical-align:middle"></a> </td></tr> <tr><td> Tirne:</td><td><input type=lItext" name="Time" class="text ll size=1I15 11 style~"background-color:#CCCCCC;"> </td></tr> <tr><td> Information:</td><td><textarea narne="Info ll class=l1text U cols="60 11 rows="lO" style="background-color:#CCCCCCi"> </textarea> </td><tr> <tr><td colspan=2> <br> <center> <input type="hidden value="submitted" name=l1success ll > <input type=" su bmit" value=IISubmitll></form></center></td></tr> </table> tl <!------------------------------------------------> <? ?> </span> <BR><BR> </div> <? bottom (); ?> U <? 1* Name: AddNews.php Function: Allows for a user to add a news post to appear on the front page *1 include_once("./includes/var.php") ; Ilchecking for authentication if ($_SESSION[ 'userID'] =="") ( Header ( IILocation: login.phpll) " else ( top() ; I l i f stuff has been posted, then process, else show form ?> <!-----text for main cell--------------------------------------------------------------------> <div style="position:absolute; width: 655px; top:Opx;text-align:left;" class="text"> <div style="rnargin-left:15pXi height:700pxj "> <br> <table valign="center ll > <tr><td style="padding-right:l0px;"><img src="img/smallacmlogo.gif" width=40 height=40></td> <td><span class=l1title">Add New News Post</span></td></tr> </table> <BR> <? if ($_POST [ , success' ] ==" submi tted" ) ( $Title=mysql_escape_string($_POST['Title']) ; $Date=time(); $PostedBy=$_SESSION['userID']; $Info=mysql_escape_string($_POST['Info']) ; Ilgetting news information $generate = "INSERT INTO News (Title,PostedDate,PostedBy,Info) VALUES ( I $Ti tIe' I $Date I I $PostedBy' I $Info ') ; II i I I I $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); mysql_query($generate, $db); echo "<span class=\"posted\">News Post Successfully Added</span>"; else { ?> <!----------------------> <table border=O class="text ll > <tr><td colspan:::2 style:::tlfont-weight:bold"> <center>Please Enter the News Post Information ... <BR><BR></center> </td></tr> <tr><td> <form name="addnews" method:::"POST ti action=tladdnews.phptl> Title:</td><td><input type=lItext" name="Title" class="text ll size="60" style="background-color:#CCCCCC;II> </td></tr> <tr><td> Information:</td><td><textarea name:::lllnfo" class=lItext" cols="60" rows="lOti style="background-color:#CCCCCCjtl> </textarea> </td><tr> <tr><td colspan=2> <br> <center> <input type="hidden" value= " submitted" name=tlsuccess"> <input type="subrnit tl value="Submittl></form></center></td></tr> </table> <!------------------------------------------------> <? ) ) ?> </span> <BR><BR> </div> <? bottom(); ?> <? 1* Name: admin.php Function: This the main screen accessed by admins to perform their various tasks *1 include_once("./includes/var.pbp") ; Ilchecking for authentication ($_SESSION [ 'userID' 1==" ") if ( Header{IILocation: login.php"); else ( top() ; ?> <!-----text for main cell~~--------------------------------------------------------------~--~> <div style="position:absolute; width:655px; top:Opx;text-align:left;" class="text"> <div style="margin-left:15px; height:700px; "> <br> <table valign=ll ce nter"> <tr><td style="padding-right:l0pxi"><img src="img/smallacmlogo.gif" width=40 height=40></td> <td><span class=lItitle ll >Adrninistration</span></td></tr> </table> <BR> <!----------------------> <center> <table border=O class=rrtext ll cellpadding=1I15" style::::"font-size:llpt; text-align:center"> <tr> <td> <a href=ttaddevent.php"><img src=l1img/addnewevent.gif" width=1I48 11 height:::: 48" border="O"><BR> 11 Add New Event</a> <ltd> <td> <a href=l1 a ddnews.php ll><img src="img/addnewnews.gif" width="48" height="48" border=IIO"><BR>Add New News Post</a> <ltd> <td> <a href="ac1rninmail.php"><img src="img/mailinglistopt.gif" width=1I48" height="48 11 border="O"><BR> Mailing List Options</a> <ltd> </tr> <tr> <td> <a href=lI newadmin.php ll><img src="img/admin.gif" width=1148 border="0"><BR> Add New Administrator</a> <ltd> </tr> </table> </span> <BR><BR> </div> <!------------------------------------------------> <? bottom(); } ?> 11 height="48 11 <? /* Name: adminmail.php Function: this page handles the mass ACM emails that can sent to the mailing list contained in the database */ include~once (It includes/var . php " ) i Ilchecking for authentication if ($_SESSION [ 'userID' ] ==" " ) { Header ("Location: login .php") ; else ( top() ; ?> <!-----text for main cell--------------------------------------------------------------------> <div style:=lIposition:absolutei width:655px; top:Opx:text-align:leftj" class:::;:"text"> <div style="margin-left:1Spx; height:700px; <br> "> <table valign="center"> <tr><td style="padding-right:l0pxj"><irng src;::;"img/smallacmlogo.gif" width=40 height=40></td> <td><span class=lItitle">Mailing List Adrninistration</span></td></tr> </table> <BR> <!----------------------> <? if (LPOST[ 'mailgroup' ]=='go') ( $subject=$_POST['subject'] ; $body=$_POST['body']; $mailString="<HTML><BODY>".$body."</BODY></HTML>"; //getting email list information = "select * from EmailList ll $generate ; $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result = mysql_query($generate, $db); $numrows = mysql_nuffi_rows($result)i for($i=O;$i<$numrows; $i++) ( $listmember=mysql_fetch_array($result) ; $mailresult=mail($listmember['Address'], $subject, $rnailString, "MIME-Version: 1. O\r\nContent-type: text/htrnl; charset=iso-8859-1\r\nFrorn: Ball State ACM<acrn@cs.bsu.edu>\r\n\r\n")i } if ($rnailresult==true) {echo "Your message was successfully sent";} else {echo "There was an error in sending your rnail ... Please Try Again"; } } else if ($_POST['getgroup'l=='go') ( echo '<span class="secondary" style=lItext-decoration:underline u > ACM Mailing List</span><br><br>': //getting email list information $generate = IIselect * from EmailList": $db = rnysql_connect{$dbHost, $dbUser, $dbPass); rnysql_select_db{$dbNarne, $db); $result = rnysql_query{$generate, $db); $nurnrows = rnysql_nurn_rows{$result); for{$i=O;$i<$nurnrows; $i++) ( $listrnernber=rnysql_fetch_array{$result) ; echo $listmember[ 'Address']." :<BR>"; else { ?> <span class="secondaryu style="text-decoration:underlinetl>View Mailing List</span><br> <form method;::;;:"post" action="adminrnail.php"> <input type=lIhidden ll name=l1getgroupl1 value="go"> To view the current ACM Mailing List <br><br> <input type=submit value="Click Here"> </form> <br><br> <span class="secondary" style="text-decoration:underline">Send Mail to the ACM Mailing List</span><br><hr> <table border=O class="text " > <tr> <td> <form method=IIPOST Ii action="adrninmail.php"> Subject: <ltd> <td> <input type:;:::"text ll name:;:::"subject" class:;::: II text 11 size:;:::1160 11 style~"background-color:#CCCCCC;"> </td></tr> <tr> <td style:;:::"vertical-align:topll> Body: <ltd> <td> <textarea name=lIbody ll class=lItext ll cols="60" rows;;;;" 10" style~"background-color:#CCCCCC;"> </textarea> </td><tr> <tr> <td colspan~2> <br> <center> <input type="hidden ll value="go" name = IImailgroup II > <input type="submit ll value="Send Mailll></form></center></td></tr> </table> <? ?> </span> <BR><BR> </div> <!------------------------------------------------> <? bottom!) ; ?> <7 /* Name: calendar.php Function: this is the smaller calendar on the main page */ include_once (" includes/var .php") i 7> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional/lEN"> <html> <head> <title>Ball State University ACM</title> <style type="text/css"> .title font-farnily:verdana, arial, sans-serif; font-size:10pt;} .shadedday { background-color:#01AOC7; padding-left:lpx; padding-top:2px; border-right: lpx solid #000000; border-bottom: lpx solid #OOOOOO;} .daybox { background-color:#FFFFFF; padding-left:lpx; padding-top:2px; border-right: lpx solid #000000; border-bottom: lpx solid #OOOOOO;} .calendartext { font-family:verdana, arial, sans-serif; font-size:7pt; text-align:right; border-left:lpx solid #000000; border-top: lpx solid #OOOOOO;} .calendarheader{ background-color:#DFEOE4; text-align:center; border-right: lpx solid #000000; border-bottom: lpx solid #000000; width:14%} .greyout { background-color:#FFFFFF; padding-left:lpx; padding-top:2px; border-right: lpx solid #000000; border-bottom: lpx solid #OOOOOO;} </style> </head> <body style~"margin:Opx; background-color:#05058D"> <?php { f/if a month and year were posted in the query string, we will use those /Iotherwise use current month/year if ($_GET[ 'month' l~~") 'n'); 'Y');} ($month~date( $year~date( else {$month~$_GET['month'l; $year~$_GET['year'l ;} Iidatabase access to retrieve dates with events $generate = IIselect * from Events where Date >::;;;'" .$year $rnonth ." -01' ORDER BY Date"; AND Date <= I II • $year . II_II. $month . "-31' II_I! $db ~ mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result ~ mysql_query($generate, $db); $numrows ~ mysql_num_rows($result); Ilget first row from db $event~mysql_fetch_array($result) ; if (LGET[ 'month' 1~~, ') {$month~date ( 'n' ) ; $year~date( 'Y');} else {$month~$_GET['month'l $year~$_GET['year'l ; ;} $first_of_month ~ mktime (0,0,0, $month, 1, $year); $maxdays ~ date('t', $first_of_month); //number of days in the month $date_info ~ getdate($first_of_month); Ilgetting info about the first day of the month $month $date_info [ 'mon' 1; $year = $textmonth $date_info['year']; $date_info['month'l; Ilgetting info about prior month $last_month ~ mktime (0,0,0, $month-1, 1, $year); $last_month); Iinumber of days in last $maxdays_1ast_month~date('t', month $weekday ~ $date_info['wday'l; Ilweekday of the first day of the monthnumber based (O~sunday) $day = 1; Ilcurrent day of current month we are in $tablecell ~ 0; IIce1l index we are in $last_month_num~$month-1; $next_month_num=$month+l; echo "<center> <a href=\ "calendar.php?month=$last_month_num&year=$year\ 11 ><img src= \lIimg/arrowleft.gif\" border=O><la> <span class=\"title\" style=\"font-size:12pt; font-weight:bold; color: #FFFFFF; padding:5px;\">$textmonth $year</span> <a href=\ "calendar.php?month=$next_rnonth_nurn&year=$year\ " ><irng src= \lIirng/arrowright.gif\1I border=O></a> </center>"i ?> <div style=l1 p adding-top:l0pXi "> <table cellspacing="OIi width="210" class=" ca l endartext"> <tr> <td class="calendarheaderll>Sun</td> <td class=ltcalendarheaderll>Mon</td> <td class="calendarheader">Tue</td> <td class="calendarheader">Wed</td> <td class="calendarheaderll>Thu</td> <td class="calendarheader">Fri</td> <td class="calendarheaderll>Sat</td></tr> <tr> <?php //taking care of days before 1st of month while ($weekday>O) ( i f ($weekday==l) {$border="border-right: 1px solid #OOOOOO";} else {$border="border-right: 1px solid #CCCCCC";} $day_to_show=$maxdays_1ast_month+1-$weekday; echo "<td class=\"greyout\" style=\"color:#CCCCCC; $border\"> $day_to_show<BR><BR></td>"i $tablecell++ ; $weekday--; $i=O; //count for events used while traversing calendar //now the actual days of the month while ($day<=$maxdays) ( if($day==datetophpday($event['Date'])&&$i<$numrows) { $output= lI<b> ['Title'])). 11. str_replace ( II . II, .. , str_replace ( , 11 , , "</b><br>Date: " . datetophp($event['Date']). $event [ 'Time'] . , ',$event II<BR>Time: II <br><br>" ; Ilif event information is too big for box, cut it off if (strlen($event['Info'] »=100) $output.=substr(str_replace(It'l1, $event['Info'])),0,100). str_replace(·II., " ... "; else $output.=str_replace(II.II, ,, str_replace ( , II , , , ',$event [' Info']) ) ; echo "<td class=\"shadedday\" onrnouseover=\" r eturn escape('" . $output . "')\">$day <BR><BR></td>"i $event~mysql_fetch_array($result) ; $i++i } else {echo "<td class=\"daybox\">$day <BR><BR></td>"i} $day++; $tablecell++ ; if ($tablecell%7~~O) {echo "</tr><tr>" i} $count~l; //count up to fill out rest of calendar while ($tablecell<35) { echo "<td class=\lIgreyout\" style=\"color:#CCCCCCi border-right: Ipx solid #CCCCCC; border-bottom:none\">$count<BR><BR></td>"; $tablecell++; $count++i echo "</tr></table></div>"i ?> <script language:::; "JavaScript " type;:"text/javascript" src:::;"./includes/wz_tooltip.js"></script> </body></html> <7 /* Name: eventscalendar.php Function: This is the bigger events calendar */ include_once (II includes/var .php") ; top (); 7> <!-----text for main cell--------------------------------------------------------------------> <div style="position:absolute; width: 655px; top:Opx;text-align:left;" class="textll> <div style="margin-left:15px; height:700px; "> <br> <table valign="center"> <tr><td style:;::;;"padding-right:l0px:"><img src=lIimg/smallacmlogo.gif" width=40 height=40></td> <td><span class="title">Events Calendar</span></td></tr> </table> <BR> <!----------------------> <7 f l i f a month and year were posted in the query string, we will use those Ilotherwise use current month/year i f ($_GET [ 'month' ] ==' , ) ($month=date('n') ; $year=date( 'Y');} else {$month=$_GET['month']; $year=$_GET['year'] ;} //database access to retrieve dates with events $generate = IIselect * from Events where Date >='" .$year $month ."-01' ORDER BY Date"; AND Date <='" . $year ,tt_", $month ."-31' $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result = mysql_query($generate, $db); $nurnrows = rnysql~num_rows{$result); //get first row from db $event=mysql_fetch_array($result); if($_GET['month']==' ') ($month=date( 'n'); $year=date('Y');} "-" else {$month=$_GET['month']; $year=$_GET['year'];} $first_of_month = mktime (0,0,0, $month, 1, $year}; $maxdays = date( 't', $first_of_month); //number of days in the month //getting info about the first $date_info = getdate($first_of_month}; day of the month $month $date_info['mon']; $year $date_info [ 'year' ] ; $textmonth $date_info['month']; //getting info about prior month $last_month = mktime (0,0,0, $month-l, 1, $year); $maxdays_last_month=date('t', $last_month}; //number of days in last month $weekday = $date_info['wday']; //weekday of the first day of the monthnumber based (O=sunday) $day = 1; //current day of current month we are in $tablecell = 0; //cell index we are in $last_month_num=$month-l; $next_month_num=$month+1; echo "<center><div style=\"width:85%; background-color:#05058D; padding:5px;\"> <a href=\"eventscalendar.php?month=$last_month_num&year=$year\"><img src=\"img/arrowleft.gif\" border=O></a> <span class=\"calendartitle\" style=\"font-size:12pt; font-weight:bold; color:#FFFFFF; padding:5px;\">$textmonth $year</span> <a href=\"eventscalendar.php?month=$next_month_num&year=$year\"><img src=\"img/arrowright.gif\" border=O></a></div>"; ?> <div style="padding-top: lOpx; "> <table cellspacing="O" width="85%11 class="calendartext ll > <tr> <td class=l1calendarheader">Sun</td> <td class="calendarheaderll>Mon</td> <td class="calendarheader">Tue</td> <td class="calendarheader ll >Wed</td> <td class="calendarheader">Thu</td> <td class="calendarheader">Fri</td> <td class="calendarheader">Sat</td></tr> <tr> <?php Iitaking care of days before 1st of month while ($weekday>O) { if ($weekday==l) {$border="border-right: lpx solid #OOOOOO";} else {$border="border-right: lpx solid #CCCCCC";} $day_to_show=$maxdays_last_month+I-$weekday; echo u<td class=\"greyout\" style=\"color:#CCCCCC; verticalalign:topi $border\rt>$day_to_show<BR><BR></td>\nrt; $tablecell++ ; $weekday- -; $i=O; //count for events used while traversing calendar //now the actual days of the month while ($day<=$maxdays) ( if($day==datetophpday($event['Date'])&&$i<$numrows) { $output= II <b> I I . str_replace { II I 11 I I str_replace ( , II I ['Title'])) . "</b><br>Date:" . datetophp($event['Date']). $event [ I Time I ] II <br><br> II i I I I I I , $event "<BR>" . flif event information is too big for box, cut it off if (strlen($event['Info']»=IOO) $output. =substr (str_replace (II $event[ 'Info'])), 0,100). " ... "; else $output.=str_replace(1I [' Info'])) ; '''I '", str_replace(' " , str_replace ( , " " I ,, " , $event echo lI<td class=\"shadedday\" onmouseover=\1t re turn escape('" . $output . "')\"> $day <img src=\"img/blank.gif\" width=\"l\" height=\"60\" align= \"right\"> <div style=\"width:lOO%; color:#OOOOOO; font-weight:bold; textalign:center: padding-left:lpx;\II>" . $event [' Title'] . "</div></td>\n"; $event=mysql_fetch_array($result) ; $i++; } else {echo u<td class=\"daybox\II>$day <irng src=\"irng/blank.gif\" width= \111\" height=\"60\" align=\"right\"></td>II;} $day++ ; $tablecell++ ; if ($tablecell%7==O) {echo "</tr><tr>";} $count=l; //count up to fill out rest of calendar while ($tablecell<35) { echo lI<td class=\lIgreyout\" style=\"color:#CCCCCC; border-right: lpx solid #CCCCCC; border-bottom:lpx solid #CCCCCC;vertical-align:top; \" >$count<BR><BR></td>\n" i $tablecell++ ; $count++; echo 1I</tr></table></div>lI; ?> <script language=11 JavaScript" type=lItext/javascript lt src=II./includes/wz_tooltip.js"></script> </div> <? bottom () ; ?> <? /* Name: index.php Function: This is the main index page which shows news posts, smaller events calendar and subscribe/unsubscribe to the mailing list the */ include_once{lIincludes/var.php") ; ?> <!DOCTYPE HTML PUBLIC "-/fW3C/fDTD HTML 4.0 Transitional//EN"> <htrnl> <head> <title>Ball State University ACM</title> <style type="text/css ll > . title { font-family:verdana, arial, sans-serif; font-size: llpt; font-weight:bold; color:#080847;} .posted { font-family:verdana, arial, sans-serif; font-size:9pt; font-weight:bold;} .text font-family:verdana, arial, sans=serif; font-size:8pt;} .footer { font-family:verdana, arial, sans-serif; font-style: italic; font-size:6pt;} </style> <link rel=li s tylesheet" href="includes/menu.css l1 > </head> <body style~"background: #999999 url(irng/bg.gif) repeat-y 50% 0; margin:Opx;11 onResize=self.location.reload(» <!---header----> <div style~"background-color:#4460C7; width:l00%; height:l00px;"> <center> <div style="position:relativei top:l0px;"><img src="img/header.gif border=O></div> </center> </div> tt <!----link line---> <div style="background-color:#080847; width:lOO%; height:28px;"> <script language=IIJavaScript ll src=lIincludes/menu.jsll></script> <!-- items structure. menu hierarchy and links are stored there --> <script language=IIJavaScript ll src=lIincludes/menu_items.j s l1></script> <!-- files with geometry and styles structures --> <script language=IIJavaScript li src="includes/menu_tpl.jsll></script> <script language=IIJavaScript"> <!--II II Note where menu initialization block is located in HTML document. II Don't try to position menu locating menu initialization block in II some table cell or other HTML element. Always put it before </body> II each menu gets two parameters (see demo files) II 1. items structure II 2. geometry structure new menu (MENU_ITEMS, MENU_POS); II make sure files containing definitions for these variables are linked to the document II if you got some javascript error like "MENU_POS is not defined", then you've made syntax II error in menu_tpl.js file or that file isn't linked properly. II also take a look at stylesheets loaded in header in order to set styles //--> <I script> </div> <!---navy box---> <center> <div style=lI width: 725pX i II> <center> <!----white box inside navy box----> cdiv style="position:relative; width:675px;top:Opx; left:Opx; textalign: left i "> <!-----text for main cell---> <div style="position:absolutei margin-left:l0pXi margin-top:20pxi width:390px; text-align:left;"> <img src=lIimg/latestnews.gif"><br><br> <? Ilgetting news information $generate = "select * from News Order By PostedDate DESC"; $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result = mysql_query($generate, $db); $numrows = mysql_num_rows($resultl; I/getting Admin information $generate = "select * from Admins"; $result2 = mysql_query{$generate, $db); $numrows2 mysql_num_rows{$result2); $adminArr = Array(); //array holding admin mailto information Ilplacing Admin information into array for{$i=O; $i<$numrows2; $i++) ( $admin=mysql_fetch_array{$result2) ; $adminArr[$admin['AdminID']]=$admin['Email']; Illooping through to and outputting each event for ($i=O;$i<$numNews && $i<$numrows; $i++) ( $news=mysql_fetch_array{$result) ; $date=date{'n.j.Y \a\t g:ia', $news['PostedDate']); $adminID=$news['PostedBy']; lithe multiple string replaces are taking the \' and \" out of the string and //adding in ' and II instead echo "<span class=\"title\">".str_replace('\\"', ,,,, str_replace("\\'!!, "''', $news[ 'Title'])) ."<br></span>1I i echo "<span class=\l1posted\">--Posted by <a href=\"mailto:".$adminArr [$adminID] ."\">" .$adminID. "</a> on ".$date. " <br></span>" i echo "<span class=\"text\">".str_replace(' \\"', '''', str_replace("\\ ''', n , " , $news [ , Info' ] ) ) . " <BR><BR><BR> " ; 7> <BR> <BR> <hr align=center width="90%"> <span class="footer"> <i>Ball State University practices equal opportunity in education and employment and is strongly and actively committed to diversity within its community.<br><br> Links contained in this file to information provided by organizations other than the Ball State University Chapter of the ACM are presented as a service and neither constitute nor imply endorsement or warranty</i> </span> </div> <div style="position:absolute; left:Opx; top:Opx;"><img src="img/leftcurve.gif"></div> <div style="position:absolutei left:400PXi top:Opxi"><img src="img/rightcurve.gif"></div> <div style="position:absolute; background-color: #080847; left:411px; top:Opx; width: 265px; height:250px;"></div> <div style="position:absolute; left:424px; top:5px;"><img src="img/upcomingevents.gif"></div> <!---------calendar box-------> <div style="position:absolute; background-color:#05058D; left:426px; top:53px; width:235px; height:197px; z-index:3;"> <div style="position:relative; left:12px; top:l0px; width:211px; "> <ifrarne src="calendar.php" width:;;"211" height=1I20Q" frameborder:::::"on scrolling=l1 no "> Your Browser Does Not Support Iframes ... Please Upgrade to the latest version for best viewing </iframe> </div> </div> <div style="position:absolute; left:412px; top:250pxj z-index:2;"> <img src="img/calendarbottom.gif"> </div> <!----for right lower white cell----> <div style="position:absolute; left:412; top:350px; width:263px;" class="text ll > <center> <span style=lItext-decoration:underline">Join the Mailing List</span> <form rnethod="POST II action="mailinglist.php"> <input type="text" name="email" class=tltext ll style="background-color: #CCCCCC;"> <input type="submit" value="Join"> <br><br><br><br> <img src=l1img/acmlogo.gif ll > <br><br><br><br><br> <img src="img/bsulogo.gif"> </div> </center> <!---end white box---> </div> <!---end navy box---> </div> </body> </html> <? /* Name: mailinglist.php Function: This function handles each add/removal from the mailing list */ include_once (" includes/var . php " ) ; top () ; ?> <!-----text for main cell--------------------------------------------------------------------> <div style="position:absolute; width: 655px; top: Opx; text-align: left; " class=lItext > <div style="margin-left:15px; height:700px; "> <br> <table valign="center"> <tr><td style="padding-right:l0pxi"><img src="img/smallacmlogo.gif" width=40 height=40></td> <td><span class:::::"title">ACM Mailing List</span></td></tr> </table> l1 <BR> <J----------------------> <? if (LPOST [ , email. ] ! = ' , ) ( //get the info posted $email=$_POST['email'] ; I/access the database and see if this email is in there $generate = "select * from ErnailList where Address:::: .... $email ... !II; $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result = mysql_query($generate, $db); $numrows = mysql_num_rows($result); //if its not in there, then its a new subscriber, so add them to the dbase if ($numrows==O) ( //query to add them $generate = "INSERT INTO EmailList VALUES(' ".$email." ')"; $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); mysql_query($generate, $db); echo l1Welcome to the ACM Mailing. been saved in our database. 11 ; ) else { //query to add them Your email address has $generate $email .... "DELETE FROM EmailList WHERE address=' II. 11 ; $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); mysql_query($generate, $db); echo "Your email has successfully been removed from the ACM Mailing List. "; } else ( ?> <center> <span style;:;:;" text-decoration: underline >Subscribe/Unsubscrib e to ll the ACM Mailing List</span> <form method=uPOST" action;::"mailinglist.php"> <input type="text" name="email class=l1text" style="backgroundcolor:#CCCCCCi"> <input type="submit" value;"Submit"> ll </center> <? ?> <jspan> <BR><BR> </div> <!------------------------------------------------> <? bottom() ; ?> <? 1* Name: newadmin.php Function: this page is for the addition of a new administrator account to the site *1 include_once("./includes/var.php") ; Ilchecking for authentication i f ($_SESSION [ 'userID' ] ==" ") { Header ( "Location: login. php") ; else ( top () ; ?> <!-----text for main cell--------------------------------------------------------------------> <div style="position:absolute; width: 655px; top: Opx;text-align: left; " class="text"> <div style="margin-left:15px; height:700px; <br> "> <table valign="center"> <tr><td style="padding-right:l0pxj ll><img src="img/srnallacmlogo.gif" width=40 height=40></td> <td><span class="title 1t >New Administrator Creation</span></td></tr> </table> <BR> <? Iisee if anything has been submitted via the form if ($_POST['submitted']=='true') ( $username=$_POST[ 'username t ] ; $password=crypt($_POST['password']) ; $email=$_POST['email']; $errormessage=II"j Ilcheck submission for errors $generate = IIselect * from Adrnins WHERE AdminID='II,$username. 1I III; $db = mysql_connect($dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result = mysql_query($generate, $db); $numrows = mysql_nuffi_rows($result)j if ($numrows>O) {$errormessage=lI<span class=\"secondary\II>Error:: Admin usernarne already exists</span>li j } else if ($_POST['password'] !=$_POST['confirmpass']) {$errorrnessage=!I<span class=\"secondary\II>Error::Passwords do not match</span>"i} if ($errormessage==' ') { //submission ok, insert $query = "INSERT INTO Admins VALUES ( , " . $usernarne. " , , $password."','" .$email. 1I ' ) ; I I ; $db = rnysql_connect($dbHost, $dbUser, $dbPass); rnysql_select_db($dbNarne, $db); rnysql_query($query, $db); echo lI<span class=\"secondary\II>Administator Successfully Added< / span> II ; ) else { echo $errormessage; else { ?> <!----------------------> <table border=O> <tr><td colspan=2 class="text" style="font-weight:bold ll > <center>Please Enter New Adrninistator Information<BR><BR></center> </td></tr> <tr><td class="text ll > <form method=POST action="newadmin.php"> Username: </td><td><input type="text" class=lItext" name="username" style="background-color:#CCCCCC;"></td></tr> <tr><td class="text"> Password: </td><td><input type="password" class="text" name="password ll style="background-color:#CCCCCC;II></td></tr><BR> <tr><td class="text"> Confirm Password: </td><td><input type="password" name="confirmpass ll class="text" style="background-color:#CCCCCC;"></td></tr><BR> <tr><td class="text"> Email Address: </td><td><input type=text" class="text" name="email" style="background-color:#CCCCCC;"></td></tr><BR> <tr><td colspan=2> <input type="hidden" name=lIsubmitted" value="true"> <center><input type=lIsubmit" value="Submit"></form></center></td></tr> </table> <!------------------------------------------------> <? ?> </span> <BR><BR> </div> <? bottom(); ?> <? /* Name: var.php Function: this is the file which is included in every page. contains some global site variables and the template functions top() and bottom() */ //database access variables $dbHost $dbUser "madison"; " acmdev"; $dbPass II acmis4u" i $dbNarne :;:; "acrndev" .. Ilcustomization variables $numNews = 7; Iinumber of news/events show on front page //session variables session_start(); session_register('userID ' ); fiend session variables function top ( ) ( ?> <!DOCTYPE HTML PUBLIC "-IIW3CIIDTD HTML 4.0 TransitionalIlEN"> <html> <head> <title>Ball State University ACM</title> <style type=="text/css ll > .title ( font-family:verdana, arial, sans-serif; font-size:14pt; font-weight:bold; text-decoration:underline;} .secondary { font-family:verdana, arial, sans-serif; font-size:llpt; font-weight:bold;} .footer ( position: relative; width: 725px; left:-25px; background-color: #999999; font-family:verdana, arial, sans-serif; font-style:italic; font-size:7pt;) .text font-family:verdana, arial, sans=serif; font-size:8pt;} It .calendartitle { font-family:verdana, arial, sans-serif; font-size:10pt:} .shadedday { color:#FFFFFF: background-color:#01AOC7: padding-left:lpx: padding-top:2px: border-right: lpx solid #000000: border-bottom: lpx solid #000000: } .daybox { background-color:#FFFFFF: padding-left:lpx: padding-top:2px: border-right: lpx solid #000000: border-bottom: lpx solid #000000: } .calendartext font-family:verdana, arial, sans-serif; font-size:7pt: text-align:right: border-left:lpx solid #000000: border-top: lpx solid #OOOOOO:} .calendarheader{ background-color:#DFEOE4: text-align:centerj border-right: lpx solid #000000: border-bottom: lpx solid #000000: width:14%} .greyout { background-color:#FFFFFF: padding-left:lpx: padding-top:2px: border-right: lpx solid #000000: border-bottom: lpx solid #OOOOOO:} </style> <script type= II text/j avascript II src=l1./includes/date-picker.js"></script> <link rel="stylesheet" href="./includes/menu.css lI > </head> <body style="background: #999999 url(./img/bg2.gif) repeat-y 50% 0:" topmargin=" 0 II leftrnargin=" 0" rightmargin="Q" bottommargin="Q" onResize=self.location.reload(» <!---header----> <div stYle="background-color:#4460C7: width:100%: height:100px:"> <center> <div style="position:relativei top:l0px;"><irng src="./img/header.gif" border=O style="display:block"></div> <Icenter> </div> <!----link line---> <div style="background-color:#080847; width:IOO%; height:28px;"> <script language="JavaScript" src=II./includes/menu.js"></script> <1-- items structure. menu hierarchy and links are stored there --> <script language="JavaScriptII src=II./includes/menu_items.j s ll></script> <!-- files with geometry and styles structures --> <script language="JavaScript ll src=II./includes/menu_tpl.jsll></script> <script language="JavaScript"> <!--II II Note where menu initialization block is located in HTML document. II Donlt try to position menu locating menu initialization block in II some table cell or other HTML element. Always put it before </body> II each menu gets two parameters (see demo files) II 1. items structure II 2. geometry structure new menu (MENU_ITEMS, MENU_POS); II make sure files containing definitions for these variables are linked to the document II if you got some javascript error like IIMENU_POS is not defined ll , then you 1 ve made syntax II error in rnenu_tpl.js file or that file isnlt linked properly. II also take a look at stylesheets loaded in header in order to set styles 11--> <I script> </div> <center> <!---navy box---> <div style=lIposition:relative; width:725pXil1> <center> <!----white box inside navy box----> <div style="position:relative; width: 675px; top:Opx; left:Opx; textalign:left;lI> <7 function bottom() { 7> <div style=l1position:relativej width: 675px; height: 25pXi backgroundcolor:#080847;"></div> <div class="footer"> <BR> <i>Ball State University practices equal opportunity in education and employment and is strongly and actively committed to diversity within its cornmunity.<br><br> Links contained in this file to information provided by organizations other than the Ball State University Chapter of the ACM are presented as a service and neither constitute nor imply endorsement or warranty</i> <BR><BR> </div> </div> <div style="position:absolute; left:Opx; top:Opxil1><img src= II • / irng /leftcurve. gif II ></div> <div style="position:absolute; left:665px; top:Opxi"><img src="./img/rightcurve.gif"></div> </center> <!---end white box---> </div> <!---end navy box---> </div> </body> </html> <7 I/this function converts the sql date format to a normal date format of MM-DD-YYYY function datetophp($sqldate) ( if ($sqldate=='OOOO-OO-OO') return I ' ; else return date("m.d.Y", strtotime($sqldate)); //this function converts the sql date format to just a day of the month function datetophpday($sqldate) { return date ("d", strtotime ($sqldate) ) i //this function converts the MM/DD/YYYY format back to the way sql wants it function datetosql($userdate) return date (nY-m-d", strtotime ($userdate) ) ; } <? 1* Name: Login Function: asks for a usernarne and password and then validates it with the information in the database *1 include_once(tt ./includes/var.phptt); if ($_POST['username'] !=' ') ( $username=$_POST['username']j $password=$_POST['password'] ; Ilgetting information for username supplied $generate = "select * FROM Admins where AdminID::::'''.$username.''''': $db = mysql_connect{$dbHost, $dbUser, $dbPass); mysql_select_db($dbName, $db); $result = mysql_query{$generate, $db); $numrows = mysql_num_rows($result); $admin=mysql_fetch_array($result); if ($numrows == 1) ( if (1) { I/login successful $_SESSION['userID']=$admin['AdminID'] ; header ( "Location: admin. php") ; top ( ) ; ?> <!-----text for main cell--------------------------------------------------------------------> <div style="position:absolute; width:655px; top:Opx;text- align: left; II class="text"> <div style="margin-left: 15px; height: 700px; <br> <table valign=l1 c enter"> "> <tr><td style="padding-right:l0px;II><img src="img/smallacmlogo.gif" width=40 height=40></td> <td><span class="titlell>Administration</span></td></tr> </table> <BR> <!----------------------> <? echo n<BR><span class=\"secondary\">Incorrect Login/Password .. Please Try Again</span>" i else ( top () ; 7> <!-----text for main cell--------------------------------------------------------------------> <div style="position:absolute; width: 655px; top:Opx;text-align:left;" class="text"> <div style~"margin-left:15px; height:700px; "> <br> <table valign="center"> <tr><td style="padding-right:l0px;"><img src="img/smallacmlogo.gifl! width~40 height~40></td> <td><span class="title">A&ninistration</span></td></tr> </table> <BR> <!----------------------> <table border~O> <tr><td colspan=2 class="text" style="font-weight:bold"> <center>Please Login ... <BR><BR></center> </td></tr> <tr><td class="text"> <form method=POST action="login.php"> Username: </td><td><input name="username" type="text" class="text" style~"background-color:#CCCCCC;"></td></tr> <tr><td class="text"> Password: </td><td><input name=lIpassword ll type="password " class="text" style~"background-color:#CCCCCC;"></td></tr><BR> <tr><td colspan=2> <center><input type="submit ll value="Submitll></form></center></td></tr> </table> <7 7> </span> <BR><BR> </div> <!------------------------------------------------> <? bottom(); 7>