BCS2203 Web Application Development

BCS2203 Web Application
Development
Assignment 1
Length Converter
Tan Woei Wen CA11068
Introduction

Online length converter is a simple but useful web-based calculation tool. It functions to convert
6 types of our daily using length unit which consist of: centimeter, feet, inch, kilometer, yard and
mile to and from their counterpart. The conversion can be run in either way, for instance, feet ->
inch or inch -> feet. Plus, unlike other online unit converters, this length converter will present
the abbreviation of the measurement unit in table form for user knowledge.
Solution
For user-end, in order to operate this application, firstly, they are demanded to insert the
quantity that they intend to convert. After that, the user has to select the unit of conversion
which represents the desired starting and ending measurements unit. Both of the conversion
unit is presented in a drop down list. Lastly, once the user click on the Convert button, the
calculation result will be shown. The conversion process is undergoing when the user clicked on
the button, the application will collect the info of quantity and the unit selected. Furthermore,
the usage of if else statements are implemented to gather information, hence decide which
equation will be apply for the calculation.
HTML coding

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!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 runat="server">
<title></title>
<style type ="text/css">

.container
{

width:900px;
margin:0 auto;
padding :10px;
border:1px solid black;
border-top:none;
font-family :Arial ;
text-align :justify;
background-image: url("a.jpg");
line-height:25px;
}

h1,h2
{
font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
font-weight: 300;
line-height: 1.1;
color: inherit;
text-align :center ;
margin-top: 21px;
margin-bottom: 10.5px;
}
h2
{
color:red ;
}
.ex
{
width:220px;
padding:10px;
border:20px black;
margin:20px;
margin-left:auto;
margin-right:auto;
}

.table
{
width:300px;
margin:0 auto;
padding :10px;
border:5px dotted purple;
}

table,th,td
{
border:1px solid black;
border-collapse:collapse;
padding:5px;
}

</style>
</head>
<body>
<form id="form1" runat="server">
<div class = "container">

<h1>*Online Length Converter* </h1>
<h2>#####Common Length Unit Abbreviations#####</h2>
<div class = "table">
<table style="width:300px">
<tr>
<th>Unit</th>
<th>Abbreviation</th>

</tr>

<tr>
<td>Centimeters</td>
<td>cm</td>
</tr>
<tr>
<td>Feet</td>
<td>ft</td>

</tr>
<tr>
<td>Inches</td>
<td>in</td>
</tr>
<tr>
<td>Kilometer</td>
<td>km</td>
</tr>
<tr>
<td>Mile</td>
<td>miles</td>
</tr>
<tr>
<td>Yard</td>
<td>yard</td>
</tr>
</table>
</div>
<p></p>

<div align = "center">
<asp:Label ID="Label2" runat="server" Text="Please insert convert quantity :"
Font-Bold="True" Font-Size="Medium"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server" Font-Bold="True" Font-Size="Medium">0</asp:TextBox>

</div>

<div class="ex">
<asp:Label ID="Label5" runat="server" Text="From" Font-Bold="True"></asp:Label>
<div align = "right">
<asp:DropDownList ID="DropDownList1" runat="server" Height="30px" Width="140px"
Font-Bold="True" Font-Italic="True" Font-Size="Medium">
<asp:ListItem>Centimeter</asp:ListItem>
<asp:ListItem>Feet</asp:ListItem>
<asp:ListItem>Inch</asp:ListItem>
<asp:ListItem>Kilometer</asp:ListItem>
<asp:ListItem>Mile</asp:ListItem>
<asp:ListItem>Yard</asp:ListItem>
</asp:DropDownList>
</div>

</div>
<div class="ex">

<asp:Label ID="Label6" runat="server"
Text="To" Font-Bold="True"></asp:Label>
<div align = "right">
<asp:DropDownList ID="DropDownList2" runat="server" Height="30px" Width="140px"
Font-Bold="True" Font-Italic="True" Font-Size="Medium" Font-Strikeout="False"
Font-Underline="False">
<asp:ListItem>Centimeter</asp:ListItem>
<asp:ListItem>Feet</asp:ListItem>
<asp:ListItem>Inch</asp:ListItem>
<asp:ListItem>Kilometer</asp:ListItem>
<asp:ListItem>Mile</asp:ListItem>
<asp:ListItem>Yard</asp:ListItem>
</asp:DropDownList>
</div>
</div>
<div align = "center">

<p>
<asp:Button ID="Button1" runat="server" Text="Convert" Font-Bold="True"
Font-Size="Larger" ForeColor="Black" Height="45px" Width="151px"/>
</p>

<asp:Label ID="Label3" runat="server" Text="Result : " Font-Bold="True"
Font-Overline="False" Font-Size="Larger"></asp:Label>
<p>
<asp:Label ID="Label4" runat="server" Text="Start Convertion!!!"
Font-Bold="True" Font-Size="XX-Large" ForeColor="#FF3300"></asp:Label>
</p>
</div>
<p style="text-align:center"><small>2013 © Tan WoeiWen, UMP</small></p>
</div>

</form>

</body>
</html>

VB Source Code

Partial Class _Default
Inherits System.Web.UI.Page

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim x As Double
Dim y As Double

Dim f As Double

x = TextBox1.Text

If DropDownList1.SelectedValue = "Centimeter" And DropDownList2.SelectedValue = "Centimeter" Then
f = 1
ElseIf DropDownList1.SelectedValue = "Centimeter" And DropDownList2.SelectedValue = "Feet" Then
f = 0.03280839895
ElseIf DropDownList1.SelectedValue = "Centimeter" And DropDownList2.SelectedValue = "Inch" Then
f = 0.3937007874
ElseIf DropDownList1.SelectedValue = "Centimeter" And DropDownList2.SelectedValue = "Kilometer" Then
f = 0.00001
ElseIf DropDownList1.SelectedValue = "Centimeter" And DropDownList2.SelectedValue = "Mile" Then
f = 0.0000062137119224
ElseIf DropDownList1.SelectedValue = "Centimeter" And DropDownList2.SelectedValue = "Yard" Then
f = 0.010936132983

ElseIf DropDownList1.SelectedValue = "Feet" And DropDownList2.SelectedValue = "Centimeter" Then
f = 30.48
ElseIf DropDownList1.SelectedValue = "Feet" And DropDownList2.SelectedValue = "Feet" Then
f = 1
ElseIf DropDownList1.SelectedValue = "Feet" And DropDownList2.SelectedValue = "Kilometer" Then
f = 0.0003048
ElseIf DropDownList1.SelectedValue = "Feet" And DropDownList2.SelectedValue = "Mile" Then
f = 0.00018939393939
ElseIf DropDownList1.SelectedValue = "Feet" And DropDownList2.SelectedValue = "Inch" Then
f = 12
ElseIf DropDownList1.SelectedValue = "Feet" And DropDownList2.SelectedValue = "Yard" Then
f = 0.33333333

ElseIf DropDownList1.SelectedValue = "Inch" And DropDownList2.SelectedValue = "Centimeter" Then
f = 2.54
ElseIf DropDownList1.SelectedValue = "Inch" And DropDownList2.SelectedValue = "Feet" Then
f = 0.08333333
ElseIf DropDownList1.SelectedValue = "Inch" And DropDownList2.SelectedValue = "Kilometer" Then
f = 0.00000254
ElseIf DropDownList1.SelectedValue = "Inch" And DropDownList2.SelectedValue = "Mile" Then
f = 0.00018939393939
ElseIf DropDownList1.SelectedValue = "Inch" And DropDownList2.SelectedValue = "Inch" Then
f = 1
ElseIf DropDownList1.SelectedValue = "Inch" And DropDownList2.SelectedValue = "Yard" Then
f = 0.027777778

ElseIf DropDownList1.SelectedValue = "Kilometer" And DropDownList2.SelectedValue = "Centimeter" Then
f = 100000
ElseIf DropDownList1.SelectedValue = "Kilometer" And DropDownList2.SelectedValue = "Feet" Then
f = 3280.839895
ElseIf DropDownList1.SelectedValue = "Kilometer" And DropDownList2.SelectedValue = "Kilometer" Then
f = 1
ElseIf DropDownList1.SelectedValue = "Kilometer" And DropDownList2.SelectedValue = "Mile" Then
f = 0.62137119224
ElseIf DropDownList1.SelectedValue = "Kilometer" And DropDownList2.SelectedValue = "Inch" Then
f = 39370.07874
ElseIf DropDownList1.SelectedValue = "Kilometer" And DropDownList2.SelectedValue = "Yard" Then
f = 1093.6132983

ElseIf DropDownList1.SelectedValue = "Mile" And DropDownList2.SelectedValue = "Centimeter" Then
f = 160934.4
ElseIf DropDownList1.SelectedValue = "Mile" And DropDownList2.SelectedValue = "Feet" Then
f = 5280
ElseIf DropDownList1.SelectedValue = "Mile" And DropDownList2.SelectedValue = "Kilometer" Then
f = 1.609344
ElseIf DropDownList1.SelectedValue = "Mile" And DropDownList2.SelectedValue = "Mile" Then
f = 1
ElseIf DropDownList1.SelectedValue = "Mile" And DropDownList2.SelectedValue = "Inch" Then
f = 63360
ElseIf DropDownList1.SelectedValue = "Mile" And DropDownList2.SelectedValue = "Yard" Then
f = 1760

ElseIf DropDownList1.SelectedValue = "Yard" And DropDownList2.SelectedValue = "Centimeter" Then
f = 91.44
ElseIf DropDownList1.SelectedValue = "Yard" And DropDownList2.SelectedValue = "Feet" Then
f = 3
ElseIf DropDownList1.SelectedValue = "Yard" And DropDownList2.SelectedValue = "Kilometer" Then
f = 0.0009144
ElseIf DropDownList1.SelectedValue = "Yard" And DropDownList2.SelectedValue = "Mile" Then
f = 0.00056818181818
ElseIf DropDownList1.SelectedValue = "Yard" And DropDownList2.SelectedValue = "Inch" Then
f = 36
ElseIf DropDownList1.SelectedValue = "Yard" And DropDownList2.SelectedValue = "Yard" Then
f = 1

End If

y = x * f

Label4.Visible = True
Label4.Text = x & " " & DropDownList1.SelectedValue & " = " & y & " " & DropDownList2.SelectedValue

End Sub

End Class

Screenshot
Homepage of Online Length Converter
The result shown after the user had inserted the conversion quantity and unit of
length.

BCS2203 Web Application Development

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

BCS2203 Web Application Development

Hochgeladen von

Copyright:

Verfügbare Formate

BCS2203 Web Application

Das könnte Ihnen auch gefallen