CSCI 4230 Homework #3
-
Upload
kaden-craft -
Category
Documents
-
view
33 -
download
0
description
Transcript of CSCI 4230 Homework #3
![Page 1: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/1.jpg)
CSCI 4230Homework #3
Group Three
Samer Al Jefri * Kevin Odom * David Hood * JD *
Philippe Gambling
![Page 2: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/2.jpg)
Agenda
1. Site Walkthrough
2. User Interface Design
3. Site Requirements & Code Implementation
4. Collaboration & Development Tools
5. Conclusion – Q&A
![Page 3: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/3.jpg)
SITE WALKTHROUGHSection One:
![Page 4: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/4.jpg)
![Page 5: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/5.jpg)
USER INTERFACE DESIGNSection Two:
![Page 6: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/6.jpg)
Phase IIDesign Elements (#1)Home Page (#2)
Phase III
Navigation (#2)
![Page 7: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/7.jpg)
SITE REQUIREMENTS & IMPLEMENTATION OF CODE
Section Three:
![Page 8: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/8.jpg)
Sign-in Page
Sign-in Components
•Use Valid E-mail Address
•Store Info In Session
•Initiate Shopping Session
•Return To Previous Page
![Page 9: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/9.jpg)
Input Field
<asp:TextBox runat="server" ID="txtUserName" />
Validation Controls
<asp:RegularExpressionValidator ID="loginRegExValidator" runat="server" ControlToValidate="txtUserName" ErrorMessage="Please, enter a valid email address."
ValidationExpression="^\w+[\w\.]*\@(\w+\.)+((com)|(net)|(org)|(edu))$" />
<asp:RequiredFieldValidator ID="loginRequiredFieldValidator" runat="server" ControlToValidate="txtUserName" ErrorMessage="This field is required." />
Submission Button
<asp:Button ID="cmdLogin" runat="server" Text="Login“ onclick="cmdLogin_Click"/>
![Page 10: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/10.jpg)
protected void cmdLogin_Click(object sender, EventArgs e) { //Clear session for new user Session.Clear();
//Save the user id to the Session Session["userID"] = txtUserName.Text;
// Goto default page unless a different path is requested string path = "Default.aspx"; if (Request.Params["returnTo"] != null) { path = Request.Params["returnTo"]; }
Response.Redirect(path); }
![Page 11: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/11.jpg)
Shipping Page
Shipping Components
•Remove Leading & Trailing Whitespace
•Reject Invalid Characters From Input
•Ensure Input Length is Reasonable
•Use Server-side Code For Field Validation
![Page 12: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/12.jpg)
Input Field
<asp:TextBox ID="txtName" runat="server" Columns="65" />
Validation Controls
<asp:RequiredFieldValidator ID="nameRequiredFieldValidator" runat="server" ErrorMessage="Required“ ControlToValidate="txtName“ Display="Dynamic"/>
<asp:RegularExpressionValidator ID="nameRegExValidator" runat="server" ErrorMessage="Please only enter letters, numbers, spaces, or periods." ControlToValidate="txtName“ ValidationExpression="\s*[a-zA-Z\s\.]+\s*" Display="Dynamic" />
<asp:RegularExpressionValidator ID="nameRegExFirstLast" runat="server" Display="Dynamic" ErrorMessage="Please enter a first and last name, no middle names" ControlToValidate="txtName“ ValidationExpression="\s*[A-Za-z]+\s+[A-Za-z]+\s*" />
![Page 13: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/13.jpg)
<asp:TextBox ID="txtStreet1" runat="server" Columns="65" />
<asp:RequiredFieldValidator ID="street1RequiredFieldValidator" runat="server" ErrorMessage="Required” ControlToValidate="txtStreet1" Display="Dynamic" />
<asp:RegularExpressionValidator ID="street1RegExValidator" runat="server" ErrorMessage="Please enter a street number and name“ ControlToValidate="txtStreet1“ ValidationExpression="^\d+\s+[A-Za-z\s\.]+“
Display="Dynamic" />
<asp:TextBox ID="txtZip" runat="server" />
<asp:RequiredFieldValidator ID="zipRequiredFieldValidator" runat="server“ErrorMessage="Required“ ControlToValidate="txtZip“ Display="Dynamic" />
<asp:RegularExpressionValidator ID="zipRegExValidator" runat="server"
ErrorMessage="Please enter in the form of #####.“ ControlToValidate="txtZip“ ValidationExpression="^\d{5}\s*$“ Display="Dynamic" />
![Page 14: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/14.jpg)
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { Page.Form.DefaultFocus = txtName.ClientID; Page.Form.DefaultButton = cmdShipFormSubmit.UniqueID;
// Populate fields with existing shipping info if (Session["ShippingData"] != null) { ShippingData shipping = (ShippingData)Session["ShippingData"]; txtName.Text = shipping.FullName; txtStreet1.Text = shipping.Street1; txtStreet2.Text = shipping.Street2; txtCity.Text = shipping.City; ddState.SelectedValue = shipping.State; txtZip.Text = shipping.Zip; }}}
![Page 15: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/15.jpg)
protected void cmdShipFormSubmit_Click(object sender, EventArgs e) { //check for valid page if (!Page.IsValid) { return; }
ShippingData shipping = new ShippingData(); shipping.FullName = txtName.Text.ToString(); shipping.Street1 = txtStreet1.Text.ToString(); shipping.Street2 = txtStreet2.Text.ToString(); shipping.City = txtCity.Text.ToString(); shipping.State = ddState.SelectedValue.ToString(); shipping.Zip = txtZip.Text.ToString();
Session["ShippingData"] = shipping;
Response.Redirect("Checkout.aspx"); }
![Page 16: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/16.jpg)
Invalid Submission
![Page 17: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/17.jpg)
Phase IIIDATABASE ACCESS & SESSION TRACKING
SLIDES HERE
(1, 3, 4, and 5 – David)
(6, 7, and 8 – Samer)
![Page 18: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/18.jpg)
David Hood
Default Page * Sign-in Page * Shopping Cart * CartData class
![Page 19: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/19.jpg)
The CartData Class
• Static Methods– getCartFromSession()– saveCartToSession()
• Public Methods– addItem()– removeItem()– reset()– setQuantity()– getTotal()– exists()– getCartTable()
![Page 20: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/20.jpg)
Default Page
User Not Logged In
User Logged in
![Page 21: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/21.jpg)
Default Page
• Login Restriction
Returns Boolean value indicating if user is logged in.
![Page 22: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/22.jpg)
Default Page
• Adding an item to the cart
![Page 23: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/23.jpg)
The Shopping Cart
![Page 24: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/24.jpg)
The Shopping Cart
• Cart GridView control binding
![Page 25: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/25.jpg)
Checkout - Features
• Confirms user shipping information and ordered items.
• Redirects user to sign-in page and/or shipping form not already in session.
• Creates new order record in database.• Clears shopping cart data.• Passes new order number to the Thank
You page.
![Page 26: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/26.jpg)
Checkout – Views
• The user’s address, shopping cart, and order total are displayed.
• Options are provided to “Continue Shopping”, “Edit Address”, “Edit Cart”, and “Place Order”
• Placing an order will create the database records and take the user to the thank you page.
• A user who tries to checkout with an empty shopping cart only has the options to “Continue Shopping” or “Edit Address”
![Page 27: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/27.jpg)
Checkout - CodeExamples from Page_Load function for Checkout.aspx• Redirecting user to sign-in page or shipping form: if (!Master.CheckLogin()) {
Server.Transfer("Login.aspx?returnTo=Checkout.aspx"); } else if (Session["ShippingData"] == null) { // Get shipping info first if not already in session Server.Transfer("Shipping.aspx"); }
• Used GridView control to display order contents: <asp:GridView ID="cartGridView" runat="server"
AutoGenerateColumns="False" EmptyDataText="Your shopping cart is empty. Please select some items before placing your order."
CssClass="table"> <Columns> <asp:BoundField DataField="Title" HeaderText="Title" /> <asp:BoundField DataField="Price" HeaderText="Price" DataFormatString="{0:c}" /> <asp:BoundField DataField="Quantity" HeaderText="Quantity" /> </Columns> <HeaderStyle BackColor="#9F89B6" /> <AlternatingRowStyle BackColor="Silver" /> </asp:GridView>
– GridView DataSource set in Page_Load: cartGridView.DataSource = this.cart.getCartTable();
• Hiding specific checkout elements if the shopping cart is empty: // Allow the user to see total price, edit cart, and place order if the cart isn't empty.
bool completeOrder = cartGridView.Rows.Count > 0; lblLabelTotal.Visible = completeOrder; lblTotal.Visible = completeOrder; cmdEditCart.Visible = completeOrder; cmdPlaceOrder.Visible = completeOrder;
![Page 28: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/28.jpg)
Checkout – New Order Record• private int createOrderInDB(string userId, ShippingData address)
{ // Define DB objects string connectionString = ConfigurationManager.ConnectionStrings["BooksDataSet"].ConnectionString;
string insertSQL = "INSERT INTO Orders ("; insertSQL += "UserName, FirstName, LastName, Address, Address2,"; insertSQL += "City, State, Zip, TransactionDate)"; insertSQL += "VALUES ("; insertSQL += "@UserName, @FirstName, @LastName, @Address, @Address2,"; insertSQL += "@City, @State, @Zip, @TransactionDate)";
OleDbConnection conn = new OleDbConnection(connectionString); OleDbCommand cmd = new OleDbCommand(insertSQL, conn);
cmd.Parameters.AddWithValue("@UserName", userId); /* OMIITTED SEVERAL cmd.Parameters.AddWithValue for brevity */ cmd.Parameters.AddWithValue("@TransactionDate", DateTime.Now.Date);
int orderId = 0; try { conn.Open(); cmd.ExecuteNonQuery(); cmd.CommandText = "SELECT @@Identity"; // Get the new OrderID orderId = (int)cmd.ExecuteScalar(); } catch (Exception err) { lblStatus.Text = "Error creating order record."; lblStatus.Text += err.Message; } finally { conn.Close(); } return orderId; }
![Page 29: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/29.jpg)
COLLABORATION & DEVELOPMENT TOOLS
Section Four:
![Page 30: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/30.jpg)
Yahoo Discussion Board
• Created a “CSCI4230_Group3” board on Yahoo groups.
• Allowed the team to meet virtually outside of class.
• Tracked team ideas, questions, and concerns.
![Page 31: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/31.jpg)
Google Code Project Hosting
• Created a project on Google Code.• Google provides free hosting for open source projects• Services Include:
– Version control via Subversion– Issue Tracking– Wiki Pages– Source code browsing– Downloads page
• Our team primarily used the version control and issue tracking features.
• See http://code.google.com/hosting for more information.
![Page 32: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/32.jpg)
Google Code Project Hosting
Issue Tracking View• List issues by priority,
milestone, owner, and more.• Helped to track overall
progress• Updating issue status
through Google code rather than email.
Source Browsing View• Users can view and
download project files without checking out entire project.
• Shows SVN status per file.
![Page 33: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/33.jpg)
Team Workflow
• Discussed tasks on Yahoo board.• Used Subversion to share files and
updates.– SVN workflow: check out->modify->update->commit– Team can work on all files concurrently. SVN merges
all the file updates for you.
• Published files to DCM server.– SVN always has the latest files, so we could
safely overwrite anything on DCM.
![Page 34: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/34.jpg)
CONCLUSIONSection Five:
![Page 35: CSCI 4230 Homework #3](https://reader030.fdocuments.in/reader030/viewer/2022033100/56813121550346895d978f35/html5/thumbnails/35.jpg)
Thank you!
•Questions?