PROJECT REPORT ON PHOTO GALLERY

Submitted by:
Abhishek Chatterjee Ashish Jaiswal

UNDER THE GUIDANCE OF:

Faculty of

Reshmi Biswas

Saltlake, Kolkata

SUBMITTED TO:

NOVEL RESEARCH AND DEVELOPMENT PVT. LTD Saltlake, Kolkata

CERTIFICATION
1

This is to certify that this report entitled Photo Gallery using JAVA and J2EE Technology is submitted by the students of B.Tech in COMPUTER SCIENCE and ENGINEERING of B.P.PODDAR INSTITUTE OF MANAGEMENT AND TECHNOLOGY under WBUT done by:
JAY KUMAR JAIN PIYUSH KUMAR SINGH.

is based on a project undertaken by them at NIVT , Kolkata under our guidance . The matter embodied in the project work is genuine and highly motivating for future reference. They have partially fulfilled the requirement of the submission of project work.

Candidates Signature Date:

........ (Reshmi Biswas) Project Guide, NIVT Date:

. Centre Head, NIVT, Saltlake

ACKNOWLEDGEMENT

We take this opportunity to express a deep sense of gratitude to our project guide Mrs. Reshmi Biswas at NIVT who helped us to complete this project. We are extremely thankful to her for taking out time from her busy schedule for giving us valuable guidance & constant encouragement throughout the duration of the project work. We would like to thank Director of Novel Institute of Vocational Training (NIVT) for the facilities he had provided me during the duration of the project work. Finally we express sincere regards to my fellow group member for his valuable cooperation and mutual coordination, which helped us in carrying out the project work successfully.
Jay Kumar Jain Piyush Kumar Singh

Date:

INDEX
1. Project Overview 2. Feasibility Study 3. System Requirement 4. Life Cycle Model 5. System Design 6. System Data Dictionary 7. Implementation and Coding Introduction Source Code 8. Screen Layout 9. Debugging 10. System Testing 11. Maintenance 12. Risk Management 13. Future Scope and Further Enhancement of the Project. 14. Conclusion 15. References and Bibliography

Project Overview
Introduction:
There are large numbers of commercial photo gallery online information service providers offering a suite of commercial properties and services tailored to the national and local needs of the commercial investments industry. These online marketplaces have thousands of commercial real estate properties for sale under various categories including commercial office space, industrial, social networking sites, personal photo uploading etc. There purpose it to attract community of industry professionals, user to select the properties with desired features. The most significant feature in these websites is the interactive search criterion which lets the users specify their requirements to get the correct set of records from the database. The search tool should be strong enough to include all the required features which a user may desire. Some new features to listings, retrieving related results for each search, etc make this application more feature rich.

Problem with Existing System:

The purpose of creating photo gallery is to outcast the discrepancies in hundred of such existing system on the World Wide Web. One of the basic problems with the existing systems is the non interactive environment they provide to the users. Most of the applications involved in business use some web template to put the content specific to their company and make it communicate with the database to search the listings. These templates simply use basic web controls to do this task making the web page non interactive. On the other hand, the motive of this Web Application is to allow the user to play with the search tool and create different combinatorial search criterion to perform exhaustive search. Another problem in such applications designed so far is the use of traditional user interfaces which make continuous post backs to the server; each post back makes a call to the server, gets the response and then refreshes the entire web form to display the result. This scenario adds an extra trade off causing a delay in displaying the results. Making such applications J2EE enabled gets rid of these unnecessary delays letting the
5

user to perform exhaustive search. The users of this application can easily feel the difference between the J2EE empowered user interfaces vs. traditional user interfaces. Scrutinizing the features of the existing systems reveals another problem, when the user tries to save some property listings; the user is forced to login as a buyer/user of this website. Once the user logs-in, he can then view this saved list. In contrast, this application uses the session state to maintain the list of saved property listings rather than making the user register first. As soon as the user performs a search, a new session first created and then lets the user select a listing. This tool then keeps track of this list until the session expires.

Objective: Photo Gallery is complete end to end solution to cover

all aspects of Real World Applications The basic objective of developing this project is: Maintain user details like user id, user name, user email id, contact detail, user address etc. Maintain photo details, photo title, uploading date, Photo category. Creation of thumbnail of property images for brochure System has powerful logical access management in place, each user must be identified by login id and strict password policy is applied to secure the system. Photo Gallery has been made keeping the user in mind. One does not want you to come to our website and get lost within all the information that exists. We have incorporated advanced search functionalities, which help you find the information that you need, in a much more accurate way, and in the least possible time.

Photo Gallery is an expert friend, who helps the user make wise photo uploading decisions. We strongly believe that once the users start using this Photo Gallery, they will realize over time that this is indeed a much better way to search for, and advertise properties not only as compared to other online portals, but also when compared to the traditional print classifieds.
6

 Photo gallery believes in perfection and quick response. Thats why reply swiftly to consumers request for services, photo uploading and related information.

Project Perspective:

Photo Gallery is a site that allows users to search for and book their desired photos, in addition to searching for existing photos. It also allows registered users upload new photos on the site.

Project Function:

Photo Gallery allows a user 1) View photos in different categories. 2) Upload photos 3).Download photos Photo Gallery also facilitates addition of new users in the database.

to

External Interface Requirement:

User Interfaces: The Photo gallery user interface consists of components that let the user search for a specific photo through different means. The Upload Photo feature can be used to upload new photos in the gallery. Website Interfaces: Photo Gallery will have access to a PhotoDetails database that will be efficiently used during searching for photo information.

Benefits of the Project:

1.Searching for different categories of photos. 2. Upload new photos 3. Allow easy entry of photo and user details 4. Easy to use and impressive GUI. 5. Post COMMENTS on photos by specific registered user. 6. Searching photos of particular name
7

Feasibility Study Report

Introduction: A feasibility analysis involves a detailed assessment of the need, value and practicality of a proposed enterprise, such as systems development. The process of designing and implementing record-keeping systems has sufficient accountability and resource implications for an organization. Feasibility analysis will help you make inform and transparent decision at crucial points during the developmental process to determine whether it is operationally, economically and technically realistic to produce with a particular course of action.

Technical Feasibility Reliable hardware and software are capable of meeting the needs of the project i.e., it can be acquired or developed to provide the information about the queries made by the users. So this project is technically feasible. Economic Feasibility: To develop the project for the purpose of study, the expense is low than expected cost. So the project is cost saving, increase revenue, increase profit. So the project is economically feasible. Operational Feasibility: Buyers, viewers and others can use and operate and support the project very easily, and its admin part is very much user friendly. So it is operationally feasible.

Social Feasibility: It is very user friendly and it can be handled by anyone even by a person who has no technical idea. So the project is socially feasible. Time Feasibility: We had expected to finish the project within the permitted time period provided by the institute and we had completed it within this time duration. So it is timely feasible. User Problem Requirement
Definition

Feasibility study System analysis Verify System model Detailed system objectives Verify Validation Validation configuration

Broad design

System Design Verify

Detailed design

User procedure Proposed equipment

Post

implementa-

Program and database specification tion Verify Broad design

Development

system implementation

Implemen tation

Broad design

Working system

Validation

System Requirements
Hardware Specification:
i) Processor : Intel Core 2 Duo ii) RAM : 2 GB iii) Hard Disc Capacity: 40 GB iv) Mother Board: Intel Original v) CD ROM Drive: Any CD ROM Drive

Software Specification:
i)IDE:- Net beans 6.9.1, Adobe Dreamweaver ii) Backend (database)- Microsoft SQL Server 2000 iii)Language:-JAVA(jdk 6.0.0 16JDK), HTML (Front end) iv)Technology:- J2EE(JSP) v)Web Server:- Apache Tomcat 5.0.19

Platform:
Operating System: Windows XP

10

LIFE CYCLE MODEL

ITERATIVE WATERFALL MODEL PROCESS MODEL:
Software development is usually characterized by a series of stages. The linear lifecycle model is referred to as Waterfall model

11

System Design
System design phase consisting of the following things : i) Entity Relationship Diagrams ii) Data Flow Diagrams iii)Structure Chart Diagrams iv) Use case diagrams

System Data Dictionary

Importance of data dictionary
A data dictionary plays a very important role in any software development process because of the following reasons: A data dictionary provides a standard terminology for all relevant data for use by the engineers working in a project. A consistent vocabulary for data items is very important, since in large projects different engineers of the project have a tendency to use different terms to refer to the same data, which unnecessary causes confusion. The data dictionary provides the analyst with a means to determine the definition of different data structures in terms of their component elements.

DATABASE DESIGN
System analysis phase needs designing for completion of the system and output of design is document for the solution. It is the critical part of the system development and it impacts on testing and maintenance. Software design deals with transforming the customer requirements, as described in the SRS document, into a form (a
12

set of documents) that is suitable for implementation in a programming language. A good software design is seldom arrived by using a single step procedure but rather through several iterations through a series of steps. Design activities can be broadly classified into two important parts: Preliminary (or high-level) design and Detailed design. Preliminary and detailed design activities: The meaning and scope of two design activities (i.e. high-level and detailed design) tend to vary considerably from one methodology to another. High-level design means identification of different modules and the control relationships among them and the definition of the interfaces among these modules.

DATA DICTIONARY
1. For Registration
FIELD NAME DATA TYPE Varchar Varchar Varchar Varchar Varchar DESCRIPTION Id of the person Account Password Name of the person Email Id of person Contact

uid
pass name1 eid addr

2. for Login
FIELD NAME DATA TYPE

u id Pass

Varchar Varchar

DESCRIPTION Id of person Account Password

13

3.For Photo Upload FIELD NAME pid uid pt pct pfile Date1 DATA TYPE Auto number varchar varchar varchar varchar varchar DESCRIPTION Photo id UserId(refernces login id) Photo title Photo id File of photo Date of uploaded photo

Implementation and Coding

Introduction:
Good software development organizations normally require their programmers to adhere to some well-defined and standard style of coding called coding standards. Most software development organizations formulate their own coding standards that suit them most, and require their engineers to follow these standards rigorously. The purpose of requiring all engineers of an organization to adhere to a standard style of coding is the following: A coding standard gives a uniform appearance to the codes written by different engineers. It enhances code understanding. It encourages good programming practices. A coding standard lists several rules to be followed during coding, such as the way variables are to be named, the way the code is to be laid out, error return conventions, etc.
14

CODING
INDEX.JSP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> <!-body,td,th { color: #00FF00; } body { background-image: url(nature_0004.jpg); } .style2 {font-size: 36px; font-family: Verdana, Arial, Helvetica, sans-serif; } .style3 { font-size: 12px; font-family: "Courier New", Courier, monospace; } .style4 { font-size: 16px; font-family: Verdana, Arial, Helvetica, sans-serif; } .style5 { font-size: 24px; font-family: Verdana, Arial, Helvetica, sans-serif; } .style6 {color: #990000} .style7 { font-size: 36px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #00FF00; } .style8 { color: #00FF00 } --> </style> <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script> </head> <body> <form action="LoginCheck1" method="post" >

15

<p align="center" class="style2"> WELCOME TO PHOTOBOOK.COM</p> <p align="center" class="style2">&nbsp;</p> <p class="style7">&nbsp;</p> <p class="style8"> <label></label> <strong>Photobook.com</strong> is animage hosting,,slideshow creation andphoto sharing website. It was founded in 2012 by Abhishek chatterjee and Ashish jaiswal and received funding from Trinity Ventures.It was acquired by Fox Interactive Media in 2012.</p> <p class="style8">In December 2009, Fox's parent company,News Corp sold Photobook.com toSeatle mobile imaging startup Ontela. Ontela then renamed itself Photobook.com Inc. and continues to operate as Photobook.com.</p> <p class="style8">In June 2010, Photobook.comt was named in the Lead411's Hottest Seattle Companies list.</p> <p class="style6"><span class="style8">Photobook.con is usually used for personal photographic image, remote storage of avatars displayed oninternet forums, and storage of videos. Photobook.com's image hosting is often used for ,MySpace (from 20072009, a corporate cousin),FaceBook accounts,Live Journals Open Diarys, or other blogs, and message boards. Users may keep their albums private, allow password-protected guest access, or open them to the public</span>.</p> <p class="style6"> <label></label> CATEGORY</p> <% // String imgcat=request.getParameter("imgcat"); String nature="Nature"; String car = "Car"; String flower ="Flower"; String celebrity ="Celebrity"; %>

<table width="200" border="0"> <tr> <td><a href="showphoto.jsp?imgc=<%=nature%>">Nature</a></td> </tr> <tr> <td><a href="showphoto.jsp?imgc=<%=flower%>">Flower</a></td> </tr> <tr> <td><a href="showphoto.jsp?imgc=<%=car%>">Car</a></td> </tr> <tr> <td>&nbsp;</td> </tr> </table>

16

<p class="style6"> <br /> </p> <p class="style6">&nbsp;</p> <p class="style5"> EnTeR yOuR LoGiN dEtAiLS....... :-)</p> <table width="361" height="165" border="1"> <tr> <td width="159">Email</td> <td width="186"> <label></label> <label> <input type="text" name="email" id="email" /> </label> </td> </tr> <tr> <td>Password</td> <td> <label> <input type="password" name="password" id="password" /> </label> </td> </tr> <tr> <td><label> <input type="submit" name="button" id="button" value="Submit" /> </label></td> <td> <label></label></td> </tr> <tr> <td width="327"><a href="registration.jsp" class="style3">I Am A New User...!!!</a></td> </tr> </table> </form> <p class="style4">&nbsp;</p> <p class="style4">&nbsp;</p> <p class="style4">SOME PHOTOS UPLOADED BY OUR MEMBERS.......!!!!</p> <p><img src="nature_0007.jpg" alt="some photos uploaded by our members" width="160" height="120" /> <img src="nature_0011.jpg" width="160" height="120" /> <img src="nature_0053.jpg" width="160" height="120" /> <img src="nature_0046.jpg" width="160" height="120" /></p> </body> </html>

---------End of index.jsp-------

17

REGISTRATION.JSP

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> <!-body,td,th { color: #990000; } body { background-image: url(nature_0053.jpg); } .style1 {font-size: 14px} .style2 { font-size: 36px; font-style: italic; } --> </style></head> <body> <p class="style2"> NeW ????....PLEAse ReGisTeR...... :-)</p> <p>&nbsp;</p> <tr> <td width="327"><div align="right"><a href="indes2.jsp" class="style1">HOME </a></div></td> <tr> <td width="327"><div align="right"><a href="editprofile.jsp" class="style1">EDIT PROFILE </a></div></td> </tr> <tr> <td width="327"><div align="right"><a href="upload.jsp" class="style1">UPLOAD PHOTO </a></div></td> </tr> <form action="insertdata" method="post"> <div align="center"> <table width="382" border="1"> <tr> <td width="165">firstname</td> <td width="201"> <input name="firstname" type="text" id="firstname" /> </td> </tr> <tr> <td>lastname</td> <td>

18

<input type="text" name="lastname" id="lastname" /> </td> </tr> <tr> <td>email</td> <td> <input type="text" name="email" id="email" /> </td> </tr> <tr> <td>password</td> <td> <label> <input type="password" name="password" id="password" /> </label> </td> </tr> <tr> <td>date</td> <td> <label></label> <label> <select name="select" id="select"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> <option>7</option> <option>8</option> <option>9</option> <option>10</option> <option>11</option> <option>12</option> <option>13</option> <option>14</option> <option>15</option> <option>16</option> <option>17</option> <option>18</option> <option>19</option> <option>20</option> <option>21</option> <option>22</option> <option>23</option> <option>24</option> <option>25</option> <option>26</option> <option>27</option> <option>28</option> <option>29</option> <option>30</option> <option>31</option> </select> </label> </td> </tr> <tr> <td>month</td> <td> <label>

19

<select name="select2" id="select2"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> <option>7</option> <option>8</option> <option>9</option> <option>10</option> <option>11</option> <option>12</option> </select> </label> </td> </tr> <tr> <td>year</td> <td> <label> <select name="select3" id="select3"> <% for(int i = 1950;i<2005;i++) { out.println("<option>"+i+"</option>"); }

%> </select> </label> </td> </tr> <tr> <td>ip</td> <td> <label> <input type="text" name="ip" id="ip" /> </label> </td> </tr> <tr> <td>gender</td> <td> <label> <input type="text" name="gender" id="gender" /> </label> </td> </tr> <tr> <td>address</td> <td> <label> <input type="text" name="address" id="address" /> </label> </td> </tr> <tr> <td>city</td> <td>

20

<label> <input type="text" name="city" id="city" /> </label> </td> </tr> <tr> <td>zip</td> <td> <label> <input type="text" name="zip" id="zip" /> </label> </td> </tr> <tr> <td>state</td> <td> <label> <input type="text" name="state" id="state" /> </label> </td> </tr> <tr> <td>country</td> <td> <label> <input type="text" name="country" id="country" /> </label> </td> </tr> <tr> <td>mobile</td> <td> <label> <input type="text" name="mobile" id="mobile" /> </label> </td> </tr> <tr> <td>occupation</td> <td> <label> <input type="text" name="occupation" id="occupation" /> </label> </td> </tr> <tr> <td>organisation</td> <td> <label> <input type="text" name="organisation" id="organisation" /> </label> </td> </tr> <tr> <td>designation</td> <td> <label> <input type="text" name="designation" id="designation" /> </label> </td> </tr> <tr> <td></td> <td> <label>

21

<input type="submit" name="button" id="button" value="Submit" /> </label></td> </tr> </table> </div> </form> </body> </html> ---------End of registration.jsp-------

EDIT PROFILE.JSP (gallery)

<%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet"%> <style type="text/css"> <!-body,td,th { color: #990000; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; } body { background-image: url(nature_0011.jpg); } .style1 { font-size: 24px; font-style: italic; } --> </style> <% String userid = String.valueOf(session.getAttribute("email")); String firstname = ""; String lastname =""; try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps = con.prepareStatement("SELECT * FROM abhi WHERE email=?"); ps.setString(1, userid); ResultSet rs = ps.executeQuery(); if (rs.next()) {

22

firstname = rs.getString(1); lastname = rs.getString(2); } } catch(Exception ex) { out.println(ex);

} %>

<div align="center"> <tr bgcolor="#009966"> <td colspan="4"><p align="center" class="style1">NeEd SoMe CHaNgEs ?????.... EdIt yoUr ProFilE..... :-)</p> <p align="center">&nbsp;</p> <table width="445" border="1" align="center"> <tr> <td width="127"> <div align="center">Email</div></td> <td width="347"><%=userid%></td> </tr> <form action="update" method="post"> <th scope="row">Firstname</th> <td><div align="center"> <form id="form4" name="form4" method="post" action=""> <label> <input type="text" name="firstname" id="firstname" /> </label> </form> </div></td> </tr> <form id="form2" name="form2" method="post" action=""> <label> <input type="text" name="textfield2" id="textfield2" /> </label> </form> <tr> <th scope="row">Lastname</th> <td><div align="center"> <form id="form3" name="form3" method="post" action=""> <label> <input type="text" name="lastname" id="lastname" /> </label> </form> </div></td> </tr> <th scope="row">Address</th> <td><div align="center">

23

<form id="form4" name="form4" method="post" action=""> <label> <input type="text" name="address" id="address" /> </label> </form> </div></td> </tr> <th scope="row">City</th> <td><div align="center"> <form id="form4" name="form4" method="post" action=""> <label> <input type="text" name="city" id="city" /> </label> </form> </div></td> </tr> <tr> <th scope="row">Zip</th> <td><div align="center"> <form id="form5" name="form5" method="post" action=""> <label> <input type="text" name="zip" id="zip" /> </label> </form> </div></td> </tr> <tr> <th scope="row">State</th> <td><div align="center"> <form id="form6" name="form6" method="post" action=""> <label> <input type="text" name="state" id="state" /> </label> </form> </div></td> </tr> <tr> <th scope="row">Mobile</th> <td><div align="center"> <form id="form7" name="form7" method="post" action=""> <label> <input type="text" name="mobile" id="mobile" /> </label> </form> </div></td> </tr> <tr> <th scope="row">Country</th> <td><div align="center"> <form id="form8" name="form8" method="post" action=""> <label>

24

<input type="text" name="country" id="country" /> </label> </form> </div></td> </tr> <tr> <th scope="row">Ip</th> <td><div align="center"> <form id="form9" name="form9" method="post" action=""> <label> <input type="text" name="ip" id="ip" /> </label> </form> </div></td> </tr> <tr> <th scope="row">Gender</th> <td><div align="center"> <form id="form10" name="form10" method="post" action=""> <p> <label> <input type="radio" name="male" value="male" id="RadioGroup1_0" /> Male</label> <br /> <label> <input type="radio" name="femal" value="female" id="RadioGroup1_1" /> Female</label> <br /> </p> </form> </div></td> </tr> <tr> <th scope="row">Date</th> <td><div align="center"> <select name="date" id="date"> <% for(int i = 1;i<32;i++) { out.println("<option>"+i+"</option>"); }

%>

</select> <label></label> <label></label> </form> </div></td> </tr>

25

<tr> <th scope="row">Month</th> <td><div align="center"> <select name="month" id="month"> <% for(int i = 1;i<13;i++) { out.println("<option>"+i+"</option>"); }

%>

</select> </div></td> </tr> <tr> <th scope="row">Year</th> <td><div align="center"><select name="year" id="year"> <% for(int i = 1950;i<2005;i++) { out.println("<option>"+i+"</option>"); }

%>

</select> </div></td> </tr> <tr> <th scope="row">Occupation</th> <td><div align="center"> <form id="form11" name="form11" method="post" action=""> <label> <input type="text" name="occupation" id="occupation" /> </label> </form> </div></td> </tr> <tr> <th scope="row">Organisation</th> <td><div align="center"> <form id="form12" name="form12" method="post" action=""> <label> <input type="text" name="organisation" id="organisation" /> </label> </form> </div></td>

26

</tr> <tr> <th scope="row">Designation</th> <td><div align="center"> <form id="form13" name="form13" method="post" action=""> <label> <input type="text" name="designation" id="designation" /> </label> </form> </div></td> </tr> </table> <form id="form1" name="form1" method="post" action=""> <label> <input type="submit" name="button" id="button" value="Submit" /> </label> </form> <p align="center">&nbsp;</p></td> </tr> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> -------End of editprofile.jsp--------

WELCOME.JSP
<%-Document : welcome Created on : Jan 11, 2012, 11:59:54 AM Author : Abhishek --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>JSP Page</title> <style type="text/css"> <!-body,td,th { color: #33FF33; } body {

27

background-image: url(nature_0007.jpg); } .style1 { font-family: Verdana, Arial, Helvetica, sans-serif } .style4 { font-family: Geneva, Arial, Helvetica, sans-serif; } --> </style></head> <body> <h1 align="center" class="style4">YOU ARE NOW SIGNED IN TO PHOTOBOOK.COM :)</h1> <p align="center" class="style4">&nbsp;</p> <p align="center" class="style4">&nbsp;</p> <p align="center" class="style4">&nbsp;</p> <p align="center" class="style4">&nbsp;</p> <table width="337" border="1" align="center"> <tr> <td width="327"><div align="center"><a href="editprofile.jsp" class="style1">Edit Profile</a></div></td> </tr> <tr> <td><div align="center"><a href="upload.jsp" class="style1">Upload Photos</a></div></td> </tr> <tr> </tr> </table> </body> </html>

--------End of welcome.jsp--------

LOGINCHECK.JAVA
import java.io.IOException; import java.io.PrintWriter; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; /**

28

* * @author user */ public class logincheck extends HttpServlet { /** * Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); HttpSession session = request.getSession(true); String id = request.getParameter("email"); String password = request.getParameter("password"); try { // String email = request.getParameter("user_id"); // String password = request.getParameter("pass"); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps = con.prepareStatement("SELECT * FROM abhi WHERE email=? AND password=?"); ps.setString(1, id); ps.setString(2, password); ResultSet rs = ps.executeQuery(); if (rs.next()) { // HttpSession session = request.getSession(true); session.setAttribute("email", id); response.sendRedirect("editprofile.jsp"); } else { response.sendRedirect("index2.jsp"); } }

catch(Exception ex) { out.println(ex); } finally { out.close(); } --------End of logincheck.java----------

} }

29

LOGOUT.JSP
<%@page contentType="text/html"%> <%@page pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> </head> <body> <% session.invalidate(); response.sendRedirect("index2.jsp?msg=Logged out succesfully."); %> </body> </html> ---------End of logOut.jsp---------

INSERTDATA.JAVA
import java.io.IOException; import java.io.PrintWriter; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.SQLException; import java.util.logging.Level; import java.util.logging.Logger; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * * @author user */ public class insertdata extends HttpServlet { protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException, ClassNotFoundException, SQLException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter();

30

String firstname=request.getParameter("firstname"); String lastname=request.getParameter("lastname"); String email=request.getParameter("email"); String password=request.getParameter("password"); String date=request.getParameter("date"); String month=request.getParameter("month"); String year=request.getParameter("year"); String ip=request.getParameter("ip"); String gender=request.getParameter("gender"); String address=request.getParameter("address"); String city=request.getParameter("city"); String zip=request.getParameter("zip"); String state=request.getParameter("state"); String country=request.getParameter("country"); String mobile=request.getParameter("mobile"); String occupation=request.getParameter("occupation"); String organisation=request.getParameter("organisation"); String designation=request.getParameter("designation"); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps=con.prepareStatement("INSERT INTO abhi VALUES (?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)"); ps.setString(1, firstname); ps.setString(2, lastname); ps.setString(3, email); ps.setString(4, password); ps.setString(5, date); ps.setString(6, month); ps.setString(7, year); ps.setString(8, ip); ps.setString(9, gender); ps.setString(10, address); ps.setString(11, city); ps.setString(12, zip); ps.setString(13, state); ps.setString(14, country); ps.setString(15, mobile); ps.setString(16, occupation); ps.setString(17, organisation); ps.setString(18, designation); int result=ps.executeUpdate(); if(result!=0) { response.sendRedirect("welcome.jsp"); } else response.sendRedirect("index2.jsp"); } catch(Exception ex) } finally {

31

out.close(); } }

// <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click on the + sign on the left to edit the code."> /** * Handles the HTTP <code>GET</code> method. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { try { processRequest(request, response); } catch (ClassNotFoundException ex) { Logger.getLogger(insertdata.class.getName()).log(Level.SEVERE, null, ex); } catch (SQLException ex) { Logger.getLogger(insertdata.class.getName()).log(Level.SEVERE, null, ex); } } /** * Handles the HTTP <code>POST</code> method. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { try { processRequest(request, response); } catch (ClassNotFoundException ex) { Logger.getLogger(insertdata.class.getName()).log(Level.SEVERE, null, ex); } catch (SQLException ex) { Logger.getLogger(insertdata.class.getName()).log(Level.SEVERE, null, ex); } } /** * Returns a short description of the servlet. * @return a String containing servlet description */ @Override public String getServletInfo() { return "Short description"; }// </editor-fold> } ---------End of insertdata.java----------

32

BIG.JSP
<%-Document : big Created on : Mar 7, 2012, 5:29:14 PM Author : user --%> <%@page import="java.sql.ResultSet"%> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> </head> <body> <% String imgpath=""; String imgid= request.getParameter("imgid"); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps = con.prepareStatement("SELECT * FROM ashish1 WHERE imgid=?"); ps.setString(1, imgid); ResultSet rs = ps.executeQuery(); if(rs.next()) { imgpath = rs.getString(3); } %> <table> <tr> <td><img src="uploadedFiles/<%=imgpath%>" height="500" width="500"</td> </tr> </table> </body> </html> ---------End of big.jsp----------

33

SHOWPHOTO.JSP
<%-Document : show_photo Created on : Mar 2, 2012, 4:47:31 PM Author : user --%> <%@page import="java.sql.ResultSet"%> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>Galleriffic | Thumbnail rollover effects and slideshow crossfades</title> <link rel="stylesheet" href="css/basic.css" type="text/css" /> <link rel="stylesheet" href="css/galleriffic-2.css" type="text/css" /> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript" src="js/jquery.galleriffic.js"></script> <script type="text/javascript" src="js/jquery.opacityrollover.js"></script> <!-- We only want the thunbnails to display when javascript is disabled --> <script type="text/javascript"> document.write('<style>.noscript { display: none; }</style>'); </script> </head> <body> <div id="page"> <div id="container"> <h1><a href="index.html">WELCOME TO PHOTOBOOK.COM</a></h1> <!-- Start Advanced Gallery Html Containers --> <div id="gallery" class="content"> <div id="controls" class="controls"></div> <div class="slideshow-container"> <div id="loading" class="loader"></div> <div id="slideshow" class="slideshow"></div> </div> <div id="caption" class="caption-container"></div> </div> <div id="thumbs" class="navigation"> <ul class="thumbs noscript"> <% String imgc = request.getParameter("imgc"); String imgpath=""; String imgid=""; Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps = con.prepareStatement("SELECT * FROM ashish1 WHERE category=?"); ps.setString(1, imgc); ResultSet rs = ps.executeQuery();

34

int i = 0; while (rs.next()) { imgid = rs.getString(1); imgpath = rs.getString(3); %> <li> <a class="thumb" name="lizard" href="uploadedFiles/<%=imgpath%>" title="Title #3" height="250" width="250"> <img src="uploadedFiles/<%=imgpath%>" height="100" width="100" /> </a> <div class="caption">hiiiiiiiiiiiiiii <div class="download"> <a href="big.jsp?imgid=<%=imgid%>">Download Original</a> </div> <div class="image-title">Title #3</div> <div class="image-desc">Description</div> </div> </li> <% } %> <div id="footer">&copy; 2012 Abhishek Chatterjee</div> <script type="text/javascript"> jQuery(document).ready(function($) { // We only want these styles applied when javascript is enabled $('div.navigation').css({'width' : '300px', 'float' : 'left'}); $('div.content').css('display', 'block'); // Initially set opacity on thumbs and add // additional styling for hover effect on thumbs var onMouseOutOpacity = 0.67; $('#thumbs ul.thumbs li').opacityrollover({ mouseOutOpacity: onMouseOutOpacity, mouseOverOpacity: 1.0, fadeSpeed: 'fast', exemptionSelector: '.selected' }); // Initialize Advanced Galleriffic Gallery var gallery = $('#thumbs').galleriffic({ delay: 2500, numThumbs: 4, preloadAhead: 10, enableTopPager: true, enableBottomPager: true, maxPagesToShow: 7, imageContainerSel: '#slideshow', controlsContainerSel: '#controls', captionContainerSel: '#caption', loadingContainerSel: '#loading', renderSSControls: true,

35

renderNavControls: true, playLinkText: 'Play Slideshow', pauseLinkText: 'Pause Slideshow', prevLinkText: '&lsaquo; Previous Photo', nextLinkText: 'Next Photo &rsaquo;', nextPageLinkText: 'Next &rsaquo;', prevPageLinkText: '&lsaquo; Prev', enableHistory: false, autoStart: false, syncTransitions: true, defaultTransitionDuration: 900, onSlideChange: function(prevIndex, nextIndex) { // 'this' refers to the gallery, which is an extension of $('#thumbs') this.find('ul.thumbs').children() .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end() .eq(nextIndex).fadeTo('fast', 1.0); }, onPageTransitionOut: function(callback) { this.fadeTo('fast', 0.0, callback); }, onPageTransitionIn: function() { this.fadeTo('fast', 1.0); } }); }); </script> </body> </html>---------End of showphoto.jsp---------

UPLOAD.JSP
<style type="text/css"> <!-body,td,th { color: #00FF00; } body { background-image: url(nature_0046.jpg); } .style2 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 36px; } .style4 {font-family: Verdana, Arial, Helvetica, sans-serif; font-style: italic; } --> </style> <div id="page"> <div align="center" class="style2">HEyy pLeAsE aDD sOmE pHoToS ...!! :-)</div> <div id="content"> <div class="post"> <h2 class="title">&nbsp;</h2> <p class="title">&nbsp;</p> <p class="title">&nbsp;</p> <p class="title">&nbsp;</p>

36

</div> <div class="post"> <div align="center"> <%

<p class="title">&nbsp;</p> <p class="title">&nbsp;</p>

String imgid = request.getParameter("imgid"); %> <table width="513" border="0"> <form action="uploadmfg.jsp" method="post" enctype="multipart/form-data"> <tr> <td width="132"><div align="center" class="style4">Upload Image</div></td> <td width="167"><input type="file" name="file" id="file" /></td> <td width="192"><input type="submit" name="button" id="button" value="Upload Img" /></td> </tr> </form> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <form action="category" method="post"> <tr> <td><div align="center" class="style4">Category</div></td> <td><select name="category" id="select"> <option>Nature</option> <option>Flower</option> <option> Bird</option> </select></td> <td><input type ="hidden" name="hidden" value="<%=imgid%>"/></td> </tr> <tr> <td>&nbsp;</td> <td><input type="submit" name="button2" id="button2" value="Submit" /></td> <td>&nbsp;</td>

</tr> </form> </table> </div> </div> </div>

--------------End of upload.jsp----------

37

UPLOADMFG.JSP
<%-Document : upload_file_multiple Created on : Jan 18, 2012, 12:11:40 PM Author : user --%> <%@page import="java.sql.ResultSet"%> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <%@page import="java.io.File"%> <%@page import="org.apache.commons.fileupload.FileItem"%> <%@page import="java.util.Iterator"%> <%@page import="org.apache.commons.fileupload.FileUploadException"%> <%@page import="java.util.List"%> <%@page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%> <%@page import="org.apache.commons.fileupload.FileItemFactory"%> <%@page import="org.apache.commons.fileupload.servlet.ServletFileUpload"%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> </head> <body> <% String category =""; String itemName = ""; String newName = ""; String id=""; String email = String.valueOf(session.getAttribute("email")); boolean isMultipart = ServletFileUpload.isMultipartContent(request); if (!isMultipart) { } else { FileItemFactory factory = new DiskFileItemFactory(); ServletFileUpload upload = new ServletFileUpload(factory); List items = null; try { items = upload.parseRequest(request); } catch (FileUploadException e) { e.printStackTrace(); } Iterator itr = items.iterator(); while (itr.hasNext()) { FileItem item = (FileItem) itr.next(); if (item.isFormField()) { } else { try { itemName = item.getName(); File f = new File("uploadedFiles/" + itemName); // backup of this source file.

38

newName = itemName; // Rename the backup file to "junk.dat" // Renaming requires a File object for the target. f.renameTo(new File(newName)); File savedFile = new File(config.getServletContext().getRealPath("/") + "uploadedFiles/" + newName); item.write(savedFile); out.println("loaction:"+config.getServletContext().getRealPath("/")+"uploadedFiles"+"\\"+newName + "</td></tr>"); } catch (Exception e) { e.printStackTrace(); } } } } out.println("<br>Inserting in the database"); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps = con.prepareStatement("INSERT INTO ashish1 VALUES (?,?,?)"); ps.setString(1, email); ps.setString(2, newName); ps.setString(3, ""); int res = ps.executeUpdate(); ps=con.prepareStatement("SELECT* FROM ashish1"); ResultSet rs=ps.executeQuery(); int i =0; while(rs.next()) { id=String.valueOf(rs.getInt(1)); } //session.setAttribute("img", filepath); } catch(Exception ex) { out.println(ex); } //out.println("<br>Successfully Inserted"); //response.sendRedirect("fileUpload.jsp?s=success"); response.sendRedirect("upload.jsp?imgid="+id);

%> </body>

39

</html> -------end of uploadmfg.jsp------

CATEGORY.JAVA
/* * To change this template, choose Tools | Templates * and open the template in the editor. */ import java.io.IOException; import java.io.PrintWriter; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; /** * * @author user */ public class category extends HttpServlet { /** * Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); HttpSession session = request.getSession(true); String imgid = request.getParameter("hidden"); String category = request.getParameter("category"); try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:imagegallery"); PreparedStatement ps = con.prepareStatement("UPDATE ashish1 SET category =? WHERE imgid=?"); ps.setString(1,category); ps.setString(2,imgid); int result = ps.executeUpdate(); if(result!=0) { out.println("updated"); response.sendRedirect("upload.jsp");

40

// response.sendRedirect("photoGallery.jsp?imgcat="+category); } else { out.println("Error during Update.........."); }

} catch(Exception ex) { out.println(ex); }

finally { out.close(); } } // <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click on the + sign on the left to edit the code."> /** * Handles the HTTP <code>GET</code> method. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } /** * Handles the HTTP <code>POST</code> method. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } /** * Returns a short description of the servlet. * @return a String containing servlet description */ @Override public String getServletInfo() { return "Short description";

41

}// </editor-fold> } -----END OF CATEGORY.JAVA----

DDSMOOTHMENU.CSS
.ddsmoothmenu{ font: bold 12px Verdana; background: #414141; /*background of menu bar (default state)*/ width: 100%; } .ddsmoothmenu ul{ z-index:100; margin: 0; padding: 0; list-style-type: none; } /*Top level list items*/ .ddsmoothmenu ul li{ position: relative; display: inline; float: left; } /*Top level menu link items style*/ .ddsmoothmenu ul li a{ display: block; background: #414141; /*background of menu items (default state)*/ color: white; padding: 8px 10px; border-right: 1px solid #778; color: #2d2b2b; text-decoration: none; } * html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/ display: inline-block; } .ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{ color: white; } .ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/ background: black; color: white; } .ddsmoothmenu ul li a:hover{ background: black; /*background of menu items during onmouseover (hover state)*/

42

color: white; } /*1st sub level menu*/ .ddsmoothmenu ul li ul{ position: absolute; left: 0; display: none; /*collapse all sub menus to begin with*/ visibility: hidden; } /*Sub level menu list items (undo style from Top level List Items)*/ .ddsmoothmenu ul li ul li{ display: list-item; float: none; } /*All subsequent sub menu levels vertical offset after 1st level sub menu */ .ddsmoothmenu ul li ul li ul{ top: 0; } /* Sub level menu links style */ .ddsmoothmenu ul li ul li a{ font: normal 13px Verdana; width: 160px; /*width of sub menus*/ padding: 5px; margin: 0; border-top-width: 0; border-bottom: 1px solid gray; } /* Holly Hack for IE \*/ * html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/ /* ######### CSS classes applied to down and right arrow images ######### */ .downarrowclass{ position: absolute; top: 12px; right: 7px; } .rightarrowclass{ position: absolute; top: 6px; right: 5px; } /* ######### CSS for shadow added to sub menus ######### */ .ddshadow{ /*shadow for NON CSS3 capable browsers*/ position: absolute; left: 0; top: 0; width: 0;

43

height: 0; background: silver; } .toplevelshadow{ /*shadow opacity for NON CSS3 capable browsers. Doesn't work in IE*/ opacity: 0.8; }

-----end of ddsmoothmenu.css-----DDSMOOTHMENU.JS
//** Smooth Navigational Menu- By Dynamic Drive DHTML code library: http://www.dynamicdrive.com //** Script Download/ instructions page: http://www.dynamicdrive.com/dynamicindex1/ddlevelsmenu/ //** Menu created: Nov 12, 2008 //** Dec 12th, 08" (v1.01): Fixed Shadow issue when multiple LIs within the same UL (level) contain sub menus: http://www.dynamicdrive.com/forums/showthread.php?t=39177&highlight=smooth //** Feb 11th, 09" (v1.02): The currently active main menu item (LI A) now gets a CSS class of ".selected", including sub menu items. //** May 1st, 09" (v1.3): //** 1) Now supports vertical (side bar) menu mode- set "orientation" to 'v' //** 2) In IE6, shadows are now always disabled //** July 27th, 09" (v1.31): Fixed bug so shadows can be disabled if desired. //** Feb 2nd, 10" (v1.4): Adds ability to specify delay before sub menus appear and disappear, respectively. See showhidedelay variable below //** Dec 17th, 10" (v1.5): Updated menu shadow to use CSS3 box shadows when the browser is FF3.5+, IE9+, Opera9.5+, or Safari3+/Chrome. Only .js file changed. var ddsmoothmenu={ //Specify full URL to down and right arrow images (23 is padding-right added to top level LIs with drop downs): arrowimages: {down:['downarrowclass', 'down.gif', 23], right:['rightarrowclass', 'right.gif']}, transition: {overtime:300, outtime:300}, //duration of slide in/ out animation, in milliseconds shadow: {enable:true, offsetx:5, offsety:5}, //enable shadow? showhidedelay: {showdelay: 100, hidedelay: 200}, //set delay in milliseconds before sub menus appear and disappear, respectively ///////Stop configuring beyond here/////////////////////////// detectwebkit: navigator.userAgent.toLowerCase().indexOf("applewebkit")!=-1, //detect WebKit browsers (Safari, Chrome etc) detectie6: document.all && !window.XMLHttpRequest, css3support: window.msPerformance || (!document.all && document.querySelector), //detect browsers that support CSS3 box shadows (ie9+ or FF3.5+, Safari3+, Chrome etc) getajaxmenu:function($, setting){ //function to fetch external page containing the panel DIVs var $menucontainer=$('#'+setting.contentsource[0]) //reference empty div on page that will hold menu $menucontainer.html("Loading Menu...")

44

$.ajax({ url: setting.contentsource[1], //path to external menu file async: true, error:function(ajaxrequest){ $menucontainer.html('Error fetching content. Server Response: '+ajaxrequest.responseText) }, success:function(content){ $menucontainer.html(content) ddsmoothmenu.buildmenu($, setting) } }) }, buildmenu:function($, setting){ var smoothmenu=ddsmoothmenu var $mainmenu=$("#"+setting.mainmenuid+">ul") //reference main menu UL $mainmenu.parent().get(0).className=setting.classname || "ddsmoothmenu" var $headers=$mainmenu.find("ul").parent() $headers.hover( function(e){ $(this).children('a:eq(0)').addClass('selected') }, function(e){ $(this).children('a:eq(0)').removeClass('selected') } ) $headers.each(function(i){ //loop through each LI header var $curobj=$(this).css({zIndex: 100-i}) //reference current LI header var $subul=$(this).find('ul:eq(0)').css({display:'block'}) $subul.data('timers', {}) this._dimensions={w:this.offsetWidth, h:this.offsetHeight, subulw:$subul.outerWidth(), subulh:$subul.outerHeight()} this.istopheader=$curobj.parents("ul").length==1? true : false //is top level header? $subul.css({top:this.istopheader && setting.orientation!='v'? this._dimensions.h+"px" : 0}) $curobj.children("a:eq(0)").css(this.istopheader? {paddingRight: smoothmenu.arrowimages.down[2]} : {}).append( //add arrow images '<img src="'+ (this.istopheader && setting.orientation!='v'? smoothmenu.arrowimages.down[1] : smoothmenu.arrowimages.right[1]) +'" class="' + (this.istopheader && setting.orientation!='v'? smoothmenu.arrowimages.down[0] : smoothmenu.arrowimages.right[0]) + '" style="border:0;" />' ) if (smoothmenu.shadow.enable && !smoothmenu.css3support){ //if shadows enabled and browser doesn't support CSS3 box shadows this._shadowoffset={x:(this.istopheader?$subul.offset().left+smoothmenu.shadow.offsetx : this._dimensions.w), y:(this.istopheader? $subul.offset().top+smoothmenu.shadow.offsety : $curobj.position().top)} //store this shadow's offsets if (this.istopheader) $parentshadow=$(document.body) else{ var $parentLi=$curobj.parents("li:eq(0)") $parentshadow=$parentLi.get(0).$shadow }

45

this.$shadow=$('<div class="ddshadow'+(this.istopheader? ' toplevelshadow' : '')+'"></div>').prependTo($parentshadow).css({left:this._shadowoffset.x+'px', top:this._shadowoffset.y+'px'}) //insert shadow DIV and set it to parent node for the next shadow div } $curobj.hover( function(e){ var $targetul=$subul //reference UL to reveal var header=$curobj.get(0) //reference header LI as DOM object clearTimeout($targetul.data('timers').hidetimer) $targetul.data('timers').showtimer=setTimeout(function(){ header._offsets={left:$curobj.offset().left, top:$curobj.offset().top} var menuleft=header.istopheader && setting.orientation!='v'? 0 : header._dimensions.w menuleft=(header._offsets.left+menuleft+header._dimensions.subulw>$(window).width())? (header.istopheader && setting.orientation!='v'? -header._dimensions.subulw+header._dimensions.w : header._dimensions.w) : menuleft //calculate this sub menu's offsets from its parent if ($targetul.queue().length<=1){ //if 1 or less queued animations $targetul.css({left:menuleft+"px", width:header._dimensions.subulw+'px'}).animate({height:'show',opacity:'show'}, ddsmoothmenu.transition.overtime) if (smoothmenu.shadow.enable && !smoothmenu.css3support){ var shadowleft=header.istopheader? $targetul.offset().left+ddsmoothmenu.shadow.offsetx : menuleft var shadowtop=header.istopheader?$targetul.offset().top+smoothmenu.shadow.offsety : header._shadowoffset.y if (!header.istopheader && ddsmoothmenu.detectwebkit){ //in WebKit browsers, restore shadow's opacity to full header.$shadow.css({opacity:1}) } header.$shadow.css({overflow:'', width:header._dimensions.subulw+'px', left:shadowleft+'px', top:shadowtop+'px'}).animate({height:header._dimensions.subulh+'px'}, ddsmoothmenu.transition.overtime) } } }, ddsmoothmenu.showhidedelay.showdelay) }, function(e){ var $targetul=$subul var header=$curobj.get(0) clearTimeout($targetul.data('timers').showtimer) $targetul.data('timers').hidetimer=setTimeout(function(){ $targetul.animate({height:'hide', opacity:'hide'}, ddsmoothmenu.transition.outtime) if (smoothmenu.shadow.enable && !smoothmenu.css3support){ if (ddsmoothmenu.detectwebkit){ //in WebKit browsers, set first child shadow's opacity to 0, as "overflow:hidden" doesn't work in them header.$shadow.children('div:eq(0)').css({opacity:0}) } header.$shadow.css({overflow:'hidden'}).animate({height:0}, ddsmoothmenu.transition.outtime)

46

} ) //end hover }) //end $headers.each() if (smoothmenu.shadow.enable && smoothmenu.css3support){ //if shadows enabled and browser supports CSS3 shadows var $toplevelul=$('#'+setting.mainmenuid+' ul li ul') var css3shadow=parseInt(smoothmenu.shadow.offsetx)+"px "+parseInt(smoothmenu.shadow.offsety)+"px 5px #aaa" //construct CSS3 box-shadow value var shadowprop=["boxShadow", "MozBoxShadow", "WebkitBoxShadow", "MsBoxShadow"] //possible vendor specific CSS3 shadow properties for (var i=0; i<shadowprop.length; i++){ $toplevelul.css(shadowprop[i], css3shadow) } } $mainmenu.find("ul").css({display:'none', visibility:'visible'}) }, init:function(setting){ if (typeof setting.customtheme=="object" && setting.customtheme.length==2){ //override default menu colors (default/hover) with custom set? var mainmenuid='#'+setting.mainmenuid var mainselector=(setting.orientation=="v")? mainmenuid : mainmenuid+', '+mainmenuid document.write('<style type="text/css">\n' +mainselector+' ul li a {background:'+setting.customtheme[0]+';}\n' +mainmenuid+' ul li a:hover {background:'+setting.customtheme[1]+';}\n' +'</style>') } this.shadow.enable=(document.all && !window.XMLHttpRequest)? false : this.shadow.enable //in IE6, always disable shadow jQuery(document).ready(function($){ //ajax menu? if (typeof setting.contentsource=="object"){ //if external ajax menu ddsmoothmenu.getajaxmenu($, setting) } else{ //else if markup menu ddsmoothmenu.buildmenu($, setting) } }) } } -----end ddsmoothmenu .js------

} }, ddsmoothmenu.showhidedelay.hidedelay)

MENU.CSS
ul.topnav { list-style: none; padding: 0 20px; margin: 0; float: left; width: 920px;

47

background: #222; font-size: 1.2em; background: url(topnav_bg.gif) repeat-x; } ul.topnav li { float: left; margin: 0; padding: 0 15px 0 0; position: relative; /*--Declare X and Y axis base for sub navigation--*/ } ul.topnav li a{ padding: 10px 5px; color: #fff; display: block; text-decoration: none; float: left; } ul.topnav li a:hover{ background: url(topnav_hover.gif) no-repeat center top; } ul.topnav li span { /*--Drop down trigger styles--*/ width: 17px; height: 35px; float: left; background: url(subnav_btn.gif) no-repeat center top; } ul.topnav li span.subhover {background-position: center bottom; cursor: pointer;} /*--Hover effect for trigger--*/ ul.topnav li ul.subnav { list-style: none; position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/ left: 0; top: 35px; background: #333; margin: 0; padding: 0; display: none; float: left; width: 170px; border: 1px solid #111; } ul.topnav li ul.subnav li{ margin: 0; padding: 0; border-top: 1px solid #252525; /*--Create bevel effect--*/ border-bottom: 1px solid #444; /*--Create bevel effect--*/ clear: both; width: 170px; } html ul.topnav li ul.subnav li a { float: left; width: 145px; background: #333 url(dropdown_linkbg.gif) no-repeat 10px center; padding-left: 20px; } html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/ background: #222 url(dropdown_linkbg.gif) no-repeat 10px center; } ------end of menu.css------

48

MENU.JS
$(document).ready(function(){ $("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*) $("ul.topnav li span").click(function() { //When trigger is clicked... //Following events are applied to the subnav itself (moving subnav up and down) $(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click $(this).parent().hover(function() { }, function(){ $(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up }); //Following events are applied to the trigger (Hover events for the trigger) }).hover(function() { $(this).addClass("subhover"); //On hover over, add class "subhover" }, function(){ //On Hover Out $(this).removeClass("subhover"); //On hover out, remove class "subhover" }); });

----end of menu.js----

49

Screen Layout
HOMEPAGE & About us

50

Gallery

Log In page
51

Welcome page

Photo upload form

52

Update profile

53

New Registration

54

DEBUGGING
Once errors are identified It is necessary identify the precise location of the errors and to fix them. Debugging approaches: Brute-Force method: This is the most common method of debugging: Least efficient method. Program is loaded with print statements Print the intermediate values Hope that some of printed values will help identify the error Backtracking: This is a fairly common approach. Beginning at the statement where an error symptom has been observed: Source code is traced backwards until the error is discovered. Cause-elimination method: Determine a list of causes: which could possibly have contributed to the error symptom. Tests are conducted to eliminate each. A related technique of identifying error by examining error symptoms: Software fault tree analysis.

55

System Testing
Introduction: Testing
a program consists of providing the program with a set of test inputs (or test cases) and observing if the program behaves as expected. If the program fails to behave as expected, then the conditions under which failure occurs are noted for later debugging and correction. Some commonly used terms associated with testing are: Failure: This is a manifestation of an error (or defect or bug). But, the mere presence of an error may not necessarily lead to a failure. Test case: This is the triplet [I, S, O], where I is the data input to the system, S is the state of the system at which the data is input, and O is the expected output of the system. Test suite: This is the set of all test cases with which a given software product is to be tested.

Unit testing
Unit testing is undertaken after a module has been coded and successfully reviewed. Unit testing (or module testing) is the testing of different units (or modules) of a system in isolation.

Black box testing

In the black-box testing, test cases are designed from an examination of the input/output values only and no knowledge of design or code is required. The following are the two main approaches to designing black box test cases. Equivalence class portioning Boundary value analysis

Integration testing
The primary objective of integration testing is to test the module interfaces, i.e. there are no errors in the parameter passing, when one module invokes another module. During integration testing, different modules of a system
56

are integrated in a planned manner using an integration plan. The integration plan specifies the steps and the order in which modules are combined to realize the full system. After each integration step, the partially integrated system is tested. An important factor that guides the integration plan is the module dependency graph. The structure chart (or module dependency graph) denotes the order in which different modules call each other. By examining the structure chart the integration plan can be developed.

System testing
System tests are designed to validate a fully developed system to assure that it meets its requirements. There are essentially three main kinds of system testing: Alpha Testing. Alpha testing refers to the system testing carried out by the test team within the developing organization. Beta testing. Beta testing is the system testing performed by a select group of friendly customers. Acceptance Testing. Acceptance testing is the system testing performed by the customer to determine whether he should accept the delivery of the system.

Performance testing
Performance testing is carried out to check whether the system needs the non-functional requirements identified in the SRS document. There are several types of performance testing. Among of them nine types are discussed below. The types of performance testing to be carried out on a system depend on the different non-functional requirements of the system documented in the SRS document. All performance tests can be considered as black-box tests.

57

MAINTENANCE
After the software has been installed it may undergo some changes. Maintenance ensures that these changings can be incorporated whenever necessary. System development needs a proper plan with a team work of technical management economical experts. Cost and benefit analysis is also needed after development for proper monitoring of developer and client relationship. Maintenance can be of three typesI. Adaptive Maintenance II. Corrective Maintenance III. Prospective Prospective

RISK MANAGEMENT
A risk is any favorable event that can occur while a project is underway. Risk management consists of three essential activities: 1. Risk identification. 2. Risk assessment. 3. Risk containment.

58

Future Scope and Further Enhancement of the Project

This project includes the basic information that you need to deploy upload photo on the site and administer the Application Software and also might be changed. It will soon be featured in new developer tools and are strong candidates for inclusion in the next. This project is developed as a masters project and still gives lot of scope for its extension the functionality of the website. Inclusion of all these features would make the application feature rich. Also it can be provided with more security features while sending mails to the user records of the individual who have logged into the project can be tracked. In the case of deletion of a user record or photo record can send to the corresponding database, a log record can be maintained per user and per photo.

Functionality Extension:
If we are going to develop real world web application based on this project, we can add some more feature as the following: Add more searching criteria. Allows user to send feedback about the software. Provide more searching options. Create rating system for each photo.

59

References and Bibliography

WEBSITES:
http://www.google.com http://www.w3school.com http ://www. magicbricks.com http://www.99acres.com http://www.sun.java.com

http://www.freecsstemplates.com

BOOKS:
Java Server Programming Black Book Head First Servlet & ISP by Basham, Sierra & Bates Fundamentals of Software Engineering by Rajiv Mall Professional JavaScript for Web Developers by Zakas Java Database Programming Bible by John ODonahue .

60