35
Bab 4
Hasil dan Pembahasan
Setelah melakukan perancangan terhadap sistem dan
menetapkan metode yang akan digunakan, maka pada bab ini akan
dilakukan pembahasan mengenai bagian-bagian dari sistem dan
analisa terhadap hasil yang telah didapatkan dari pembuatan aplikasi
Properti Berbasis Web.
4.1 Pembuatan Sistem User
4.1.1 Halaman home
Merupakan halaman home dari user. Pada halaman utama
terdapat 3 kategori pertanyaan, yang masing-masing berisi
pertanyaan dari tiap kategori. Terdapat juga menu yang akan
menampung pilihan pertanyaan yang telah dipilih oleh user dan
juga menu untuk administrator untuk melakukan maintenance
data, serta link untuk kurs dollar. Keseluruhan halaman home,
dapat dilihat pada Gambar 4.1
Gambar 4.1 Tampilan home
36
Berikut kode program untuk menampilkan link menu dan
kategori dari setiap pertanyaan, dapat dilihat pada kode program
4.1
Kode Program 4.1 Kode View untuk menampilkan menu dan link kategori
1. <ul id="navlist">
2. <li class="first">
3. <a href="@Url.Content("~")"id="current">Home</a></li>
4. <li>@{Html.RenderAction("CartSummary", "ShoppingCart");}</li>
5. <li><a href="@Url.Content("~/StoreManager/")">Admin</a></li>
6. </ul>
7. </div>
8. @{Html.RenderAction("Menu", "Store");}
9. <div id="main">
10. @RenderBody() 11. </div>
Kode perintah @{Html.RenderAction berfungsi untuk
mengambil isi dari ChartSummary yang berada dalam folder
ShoppingChart. Sedangkan kode perintah @RenderBody() berfungsi
untuk melakukan render body dari kode yang terdapat pada
file.css.
Kode Program 4.2 Kode Controller untuk halaman home
1. using System.Collections.Generic;
2. using System.Linq;
3. using System.Web.Mvc;
4. using MVC.Models;
5. namespace MVC.Controllers
6. {
7. public class HomeController : Controller
8. {
9. EntitiesDB storeDB = new EntitiesDB();
10. public ActionResult Index() 11. { 12. var quest = GetTopQuestion(5); 13. return View(quest); 14. } 15. private List<Question> GetTopQuestion(int count) 16. { 17. return storeDB.Questions 18. .OrderByDescending(a => a.AnswerResults.Count()) 19. .Take(count) 20. .ToList(); 21. } 22. } 23. }
37
Pada Kode Program 4.2, terdapat beberapa fungsi yang
akan melakukan control terhadap database. Yaitu EntitiesDB
storeDB = new EntitiesDB yang merupakan inisialisasi dari class
EntitiesDB, dan return stored yang merupakan pengembalian dari
database berupa list.
Kode Program 4.3 Kode Model untuk halaman home
1. using System.Data.Entity;
2. namespace MVC.Models
3. {
4. public class EntitiesDB : DbContext
5. {
6. public DbSet<Question>Questions{ get; set; }
7. public DbSet<Category>Categorys{ get; set; }
8. public DbSet<QuestionCategory>QuestionCategorys{ get; set; }
9. public DbSet<Cart>Carts{ get; set; }
10. public DbSet<Guest>Guests{ get; set; } 11. public DbSet<Result>Results{ get; set; } 12. } 13. }
Kode Program 4.3, merupakan database context yang
mengambil setiap field pada database. Class EntitiesDB inilah
yang menjadi class perantara antara aplikasi dan database.
4.1.2 Halaman browse kategori
Pada halaman browse kategori, terdapat pertanyaan dari
setiap kategori. Kategori yang ada yaitu kategori building, water,
dan energy. Keseluruhan tampilan dapat dilihat pada Gambar 4.2,
4.3, dan 4.4
38
Gambar 4.2 Tampilan halaman browse kategori building
Gambar 4.2 merupakan halaman browse kategori
building. User dapat memilih pertanyaan yang sesuai dengan
objek yang akan ditawarkan.
Gambar 4.3 Tampilan halaman browse kategori water
Gambar 4.3 merupakan halaman browse kategori
water. User dapat memilih pertanyaan yang sesuai dengan objek
yang akan ditawarkan.
39
Gambar 4.4 Tampilan halaman browse kategori energy
Gambar 4.4 merupakan halaman browse kategori
energy. User dapat memilih pertanyaan yang sesuai dengan
objek yang akan ditawarkan.
Berikut Kode Program untuk menampilkan list data pertanyaan,
dapat dilihat pada Kode Program 4.4
Kode Program 4.4 Kode View untuk menampilkan list pertanyaan
1. @model MVC.Models.Category
2. @{ViewBag.Title = "Browse Question";}
3. <div class="categories">
4. <h3><em>@Model.Name</em> Question</h3>
5. <ul id="data-list">
6. @foreach (var quest in Model.Questions)
7. {
8. <li>
9. <a href="@Url.Action("Details", new { id = quest.QuestionId
})">
10. <img alt="@quest.Title" src="@quest.DisplayArtUrl" /> 11. <span>@quest.Title</span> 12. </a> 13. </li> 14. } 15. </ul> 16. </div>
40
Kode Program 4.5 Kode Controller untuk menampilkan list pertanyaan
1. public ActionResult Browse(string categori)
2. {
3. var categoryModel = storeDB.Categorys.Include("Questions")
4. .Single(g => g.Name == categori);
5. return View(categoryModel);
6. }
7. public ActionResult Details(int id)
8. {
9. var question = storeDB.Questions.Find(id);
10. return View(question); 11. } 12. [ChildActionOnly] 13. public ActionResult Menu() 14. { 15. var categori = storeDB.Categorys.ToList(); 16. return PartialView(genres); 17. } 18. } 19. }
Dari Kode Program 4.5, pencarian kategori dilakukan
berdasarkan string per-kategori. Sedangkan untuk detail dari setiap
kategori dilakukan dengan mengambil nilai dari Id setiap kategori.
Dalam pengambilan value dari kategori, proses dilakukan dengan
menggabungkan model class question dan class kategory. Class
question dan kategori dapat dilihat pada Kode Program 4.6 dan 4.7
Kode Program 4.6 Kode Model untuk menampilkan list pertanyaan
1. namespace MVC.Models
2. {
3. public partial class Category
4. {
5. public int CategoryId { get; set; }
6. public string Name { get; set; }
7. public string Description { get; set; }
8. public List<Question> Questions { get; set; }
9. }
10. }
41
Kode Program 4.7 Kode Model untuk menampilkan list pertanyaan
1. namespace MVC.Models
2. {
3. [Bind(Exclude = "QuestionId")]
4. public class Question
5. {
6. [ScaffoldColumn(false)]
7. public int QuestionId { get; set; }
8. [DisplayName("Categori")]
9. public int CategoryId { get; set; }
10. [DisplayName("QuestCategori")] 11. public int QuestionCategoryId { get; set; } 12. [Required(ErrorMessage = "An Question Title is required")] 13. [StringLength(160)] 14. public string Title { get; set; } 15. [Required(ErrorMessage = "Nominal is required")] 16. [Range(0.01, 10000000.00,
ErrorMessage = "Nominal must be between 0.01 and
1000000.00")]
17. public decimal Nominal { get; set; } 18. [DisplayName("Display Art URL")] 19. [StringLength(1024)] 20. public string DisplayArtUrl { get; set; } 21. public virtual Category Categori {get; set; } 22. public virtual QuestionCategory QuestionCategory
{ get; set; }
23. public virtual List<Result> AnswerResults { get; set; } 24. } 25. }
Kode Program 4.6 dan 4.7, merupakan class penjembatan
antara aplikasi dan database. Class category terdiri dari 3
parameter, dan 1 parameter sebagai penghubung dengan class
question. Sedangkan class question menangani value dari class
question database. Fungsi dari required errormessage yaitu untuk
menampilkan informasi jika terjadi kegagalan atau kesalahan
dalam aplikasi. Sedangkan scaffoldColumn merupakan auto
generate pada saat men-generate class tersebut. ScaffoldColumn
sendiri merupakan sebuah template untuk pemodelan interface.
4.1.3 Halaman list chart
Halaman list chart merupakan halaman untuk menampung
setiap pilihan dari user. Pada halaman ini juga nilai total dari
42
setiap pilihan dijumlahkan. Keseluruhan halaman dapat dilihat
pada Gambar 4.5
Gambar 4.5 Tampilan halaman list chart
Berikut Kode Program untuk menampung pilihan dari user
serta fungsi total, dapat dilihat pada Kode Program 4.8
Kode Program 4.8 Kode View untuk menampilkan list chart
1. <scriptsrc="/Scripts/jquery-1.4.4.min.js"
type="text/javascript"></script>
2. <script type="text/javascript">
3. $(function () {
4. $(".RemoveLink").click(function ()
5. {var recordToDelete = $(this).attr("data-id");
6. if (recordToDelete != '') {
7. $.post("/ShoppingCart/RemoveFromCart", { "id": recordToDelete
},
8. });
9. });
………………………………. ……………………………….
10. if (data.ItemCount == 0) { 11. $('#row-' + data.DeleteId).fadeOut('slow'); 12. } else { 13. $('#item-count-' + data.DeleteId).text(data.ItemCount); 14. } 15. $('#cart-total').text(data.CartTotal); 16. $('#update-message').text(data.Message); 17. $('#cart-status').text('Cart (' + data.CartCount + ')'); 18. }
19. </script> 20. <h3><em>Review</em> your list</h3> 21. <p class="button"> 22. @Html.ActionLink("Checkout >>>", "Address", "Checkout") 23. </p>
43
Kode Program 4.8 Kode View untuk menampilkan list chart
………………………. ……………………….
24. @foreach (var item in Model.CartItems) 25. { 26. <tr id="[email protected]"> 27. <td>@Html.ActionLink(item.Quest.Title, "Details", "Store", new
{ id = item.QuestionId }, null)</td>
28. <td>@item.Quest.Nominal</td> 29. <td id="[email protected]"> 30. @item.Count</td> 31. <td><a href="#" class="RemoveLink" data-
id="@item.RecordId">Remove from list</a></td></tr>}
32. @Html.ActionLink("Log off", "LogOff", "Account") 33. </p>
Fungsi Kode Program 4.8 adalah untuk melakukan handle
data dari pilihan user, terdapat script yang berfungsi untuk
interface. Sedangkan fungsi dari setiap kode @ yaitu untuk
mengambil nilai dari model yang nantinya akan ditampilkan
melalui view. Class model untuk menampilkan list chart dapat
dilihat pada Kode Program 4.9
Kode Program 4.9 Kode Model untuk menampilkan list chart
1. namespace MVC.Models
2. {
3. public partial class ShoppingCart
4. {
5. EntitiesDB storeDB = new EntitiesDB();
6. string ShoppingCartId { get; set; }
7. public const string CartSessionKey = "CartId";
………………………………………
………………………………………
………………………………………
8. public static ShoppingCart GetCart(HttpContextBase context)
9. {
10. foreach (Cart item in shoppingCart) 11. { 12. item.CartId = userName; 13. } 14. storeDB.SaveChanges(); 15. } 16. } 17. }
44
Dari Kode Program 4.9, terdapat beberapa fungsi.
1. Fungsi add to chart. Berfungsi untuk menerima inputan dari user
dan selanjutnya ditampung kedalam chart.
2. Fungsi remove chart. Berfungsi untuk menghapus chart dari list.
Proses penghapusan juga mengembalikan nilai dari jumlah list yang
ada, setelah list terhapus.
3. Fungsi empty chart. Berfungsi jika list chart dalam keadaan null
atau empty.
4. Fungsi getCount. Berfungsi untuk melakukan penjumlahan item
dari setiap question yang telah dipilih oleh user.
5. Fungsi getTotal. Berfungsi untuk melakukan penjumlahan nilai
nominal dari setiap question yang telah dipilih oleh user.
6. Fungsi createOrder. Berfungsi untuk identifikasi semua pilihan
dari user, sehingga setiap pilihan dalam list dapat ter-autentikasi.
7. Fungsi migrateChart. Berfungsi untuk autentikasi username dari
setiap list pilihan user.
Sedangkan untuk controller dari list chart dapat dilihat pada
Kode Program 4.10
Kode Program 4.10 Kode Controller untuk menampilkan list chart
1. public class ShoppingCartController : Controller
2. {
3. EntitiesDB storeDB = new EntitiesDB();
4. public ActionResult Index()
5. {
6. var cart = ShoppingCart.GetCart(this.HttpContext);
7. var viewModel = new CartViewModel
8. {
9. CartItems = cart.GetCartItems(),
10. CartTotal = cart.GetTotal()}; 11. return View(viewModel);}
……………………………….
……………………………….
……………………………….
12. var cart = ShoppingCart.GetCart(this.HttpContext); 13. ViewData["CartCount"] = cart.GetCount(); 14. return PartialView("CartSummary");
45
Dari Kode Program 4.10 terdapat 3 fungsi utama, yaitu
fungsi add to chart, remove from chart, dan cartSummary. Fungsi
add to chart yaitu memasukan question yang telah dipilih oleh
user kedalam list, fungsi remove from chart, yaitu menghapus
chart yang terdapat dalam list, dan chart summary yang berfungsi
untuk mengambil semua nilai total termasuk nominal dan quantity.
Semua fungsi tersebut berhubungan dengan database, sehingga
semua transaksi akan mengupdate database.
4.1.4 Halaman Login
Pada halaman login, user diharuskan memasukkan
username dan password. Jika user tidak memiliki account, maka
user dapat melakukan registrasi. Setelah user memiliki account,
maka login dapat berhasil, lalu user akan diminta memasukkan
data diri yang meliputi nama, alamat, kota, provinsi, kode pos,
nomor telepon, dan alamat email. Keseluruhan halaman dapat
dilihat pada Gambar 4.6, Gambar 4.7, dan Gambar 4.8
Gambar 4.6 Tampilan halaman Login User
46
Gambar 4.7 Tampilan halaman Create New Account
Gambar 4.7 merupakan halaman create new account, dimana
terdapat 4 field yang harus diisi oleh user. Meliputi username, email
address, password, dan confirm password.
Gambar 4.8 Tampilan halaman User Information
Berikut Kode Program view untuk halaman login, dapat dilihat
pada Kode Krogram 4.11
47
Kode Program 4.11 Kode View untuk halaman Login
1. @model MVC.Models.LogOnModel
2. @{ViewBag.Title = "Log On";}
3. <h2>Log On</h2>
4. <p>Please enter your username and password.
@Html.ActionLink("Register", "Register") if you don't have an
account.</p>
5. <script src="@Url.Content("~/Scripts/jquery.validate.min.js")"
type="text/javascript"></script>
6. <script
src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.
a. min.js")" type="text/javascript"></script>
7. @Html.ValidationSummary(true, "Login was unsuccessful. Please
correct the errors and try again.")
8. @using (Html.BeginForm()) {
9. <div>
10. <fieldset> 11. <legend>Account Information</legend>
12. <div class="editor-label"> 13. @Html.LabelFor(m => m.UserName) 14. </div> 15. <div class="editor-field"> 16. @Html.TextBoxFor(m => m.UserName) 17. @Html.ValidationMessageFor(m => m.UserName) 18. </div>
19. <div class="editor-label"> 20. @Html.LabelFor(m => m.Password) 21. </div> 22. <div class="editor-field"> 23. @Html.PasswordFor(m => m.Password) 24. @Html.ValidationMessageFor(m => m.Password) 25. </div>
26. <div class="editor-label"> 27. @Html.CheckBoxFor(m => m.RememberMe) 28. @Html.LabelFor(m => m.RememberMe) 29. </div> 30. <p><input type="submit" value="Log On" /></p> 31. </fieldset> 32. </div> 33. }
Dari Kode Program 4.11, merupakan kode interface untuk
login user dan login administrator, hanya proses login yang
membedakan, yaitu username dan password. Sedangkan proses
autentikasi username dan password tidak melalui query database
atau sejenisnya, melainkan menggunakan fitur dari ASP.NET,
yaitu ASP.NET Configuration yang dapat dilihat pada Gambar
48
4.9. Dari sini akan tercatat secara otomatis, username dan
password pada saat melakukan registrasi. Sebagai administrator,
configurasi dapat dilakukan untuk menambah user, atau
menghapus user yang dilakukan secara manual.
Gambar 4.9 Tampilan ASP.NET Configuration
Berikut kode Controller dan Model untuk proses Login
dapat dilihat pada Kode Program 4.12
Kode Program 4.12 Kode Controller untuk halaman Login
1. namespace MVC.Controllers
2. {
3. public class AccountController : Controller
4. {
5. public IFormsAuthenticationService FormsService { get; set; }
6. public IMembershipService MembershipService { get; set; }
7. protected override void Initialize(RequestContext
requestContext)
8. {
9. if (FormsService == null) { FormsService = new
FormsAuthenticationService(); }
10. if (MembershipService == null) { MembershipService = new AccountMembershipService(); }
11. base.Initialize(requestContext); 12. }
…………………………….
…………………………….
…………………………….
13. [Authorize] 14. public ActionResult ChangePassword() 15. { 16. ViewBag.PasswordLength = MembershipService.MinPasswordLength; 17. return View();
49
Dari Kode Program 4.12, terdapat beberapa fungsi utama
yaitu, logon, logoff, register, dan change password. Fungsi login
sebagai validasi user yang masuk ke dalam sistem perbedaan
validasi berdasarkan username dan password. Fungsi logoff untuk
keluar dari sistem, dan menghapus seluruh session yang ada.
Fungsi register digunakan untuk melakukan registrasi terhadap
user baru yang belum memiliki account sebelumnya, dan change
password digunakan untuk mengganti password yang telah ada
dengan password yang baru. Terdapat juga peringatan jika terjadi
kesalahan dalam melakukan login dan perubahan password.
Kode Program 4.13 Kode Model untuk halaman Login
1. namespace MVC.Models
2. {
3. #region Models
4. public class ChangePasswordModel
5. {
6. [Required]
7. [DataType(DataType.Password)]
8. [Display(Name = "Current password")]
9. public string OldPassword { get; set; }
10. [Required] 11. [ValidatePasswordLength] 12. [DataType(DataType.Password)] 13. [Display(Name = "New password")] 14. public string NewPassword { get; set; } 15. [DataType(DataType.Password)] 16. [Display(Name = "Confirm new password")] 17. [Compare("NewPassword", ErrorMessage = "The new password and
confirmation password do not match.")]
18. public string ConfirmPassword { get; set; } 19. }
………………………………..
………………………………..
………………………………..
20. public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata,
ControllerContext context)
21. { ModelClientValidationStringLengthRule(FormatErrorMessage(me
tadata.GetDisplayName()), _minCharacters, int.MaxValue)
22. }; 23. } 24. } 25. #endregion 26. }
50
Dari Kode Program 4.13, fungsi utama yaitu melakukan
verifikasi terhadap setiap username dan password serta password
baru pada saat penggantian password. Terdapat validasi terhadap
setiap password yang harus memiliki minimal 7 karakter dan
dalam 7 karakter tersebut terdiri dari alphabet, numerik dan
simbol.
Jika tidak sesuai dengan kriteria, maka peringatan akan
muncul berdasarkan kesalahan dari user. Untuk kode lengkap
dapat dilihat pada lampiran.
4.1.5 Halaman manage data
Pada halaman manage data, khususnya untuk
administrator, terdapat 3 pilihan menu yaitu create new, edit dan
delete. Halaman keseluruhan dapat dilihat pada Gambar 4.9
Gambar 4.10 Tampilan halaman manage data
Dari halaman manage data, administrator dapat melakukan
insert data baru dengan memilih link create new. Sedangkan link
edit dan delete berfungsi untuk melakukan edit data yang telah ada
untuk diperbaharui dan delete untuk menghapus data yang ada.
51
Halaman create new, edit dan delete dapat dilihat pada Gambar
4.10, Gambar 4.11, Gambar 4.12
Gambar 4.11 Tampilan halaman create new question
Gambar 4.10 merupakan halaman create new question. Terdapat
5 field yang harus diisi, antara lain category, question category, title,
nominal, dan display art url.
Gambar 4.12 Tampilan halaman edit question
52
Gambar 4.11 merupakan halaman edit question. Terdapat 5 field
yang dapat diubah antara lain category, question category, title,
nominal, dan display art url.
Gambar 4.13 Tampilan halaman delete question
Gambar 4.12 merupakan halaman delete confirmation. Terdapat
button delete sebagai tanda user menyetujui penghapusan data.
Berikut Kode Program view untuk halaman manage data.
Kode Program 4.14 Kode View untuk halaman manage data
1. @model IEnumerable<MVC.Models.Question>
2. @using MVC.Helpers
3. @{ViewBag.Title = "Store Manager - All Questions";
4. }
5. <h2>Index</h2>
6. <p>@Html.ActionLink("Create New ", "Create")
7. </p>
8. <table><tr>
9. <th></th>
10. <th>Title</th> 11. <th>Question Title</th> 12. <th>Category</th> 13. </tr> 14. @foreach (var item in Model) { 15. <tr> 16. <td>@Html.ActionLink("Edit", "Edit", new { id=item.QuestionId
}) | @Html.ActionLink("Delete", "Delete", new {
id=item.QuestionId })
17. </td> 18. <td>@Html.Truncate(item.Title, 25) </td> 19. <td>@Html.Truncate(item.QuestionCategory.TitleCategory,
25)</td>
…………………………. …………………........
53
Dari Kode Program 4.14, dapat dilihat beberapa fungsi,
antara lain yaitu fungsi truncate dan IEnumerable. Fungsi truncate
digunakan untuk membatasi nilai dari row tabel. Sedangkan
IEnumerable digunakan untuk mengambil nilai tertentu dari form
@Html.
Sedangkan untuk kode controller dapat dilihat pada Kode
Program 4.15
Kode Program 4.15 Kode Controller untuk halaman manage data
1. namespace MVC.Controllers
{
2. [Authorize(Roles = "Administrator")]
3. public class StoreManagerController : Controller
4. {
5. EntitiesDB storeDB = new EntitiesDB();
6. public ActionResult Index()
7. {
8. var albums = storeDB.Questions
.Include("Categori").Include("QuestionCategory")
.ToList();
9. return View(albums);
10. } ………………………………
…………………………….
…………………………….
11. [HttpPost] 12. public ActionResult Delete(int id, FormCollection collection) 13. { 14. var album = storeDB.Questions.Find(id);
15. storeDB.Questions.Remove(album); 16. storeDB.SaveChanges(); 17. return View("Deleted"); 18. } 19. } 20. }
Dari Kode Program 4.15, terlihat bahwa dalam halaman ini,
autentikasi diberikan kepada administrator sebagai hak dalam
melakukan manage data, dengan adanya [Authorize(Roles =
"Administrator")]
54
4.2 Pengujian Sistem
Untuk pengujian aplikasi properti berbasis web ini
menggunakan metode blackbox. Pengujian dilakukan oleh bagian
pemasaran Damai Putra Group bagian pengolahan data, dan dua
orang staff pegawai sebagai guest. Rincian pengujian dapat dilihat
pada Tabel 4.1 berikut :
a. Pengujian Login untuk melakukan pengecekan apakah
fungsional dari halaman Login telah berjalan dengan baik. Dari
pengujian yang dilakukan didapat kesimpulan bahwa halaman
Login telah berjalan dengan baik.
Tabel 4.1 Pengujian Blackbox halaman Login
Aktivitas
dan Event
Input Output Status
Pengujian
Login user
dengan klik
tombol
login
Username
dan
Password
a. Jika berhasil maka
masuk halaman user
information dengan
hak akses sebagai
user
b. Jika password salah
maka akan muncul
peringatan password
salah
c. Jika username salah
maka akan muncul
peringatan username
salah
Valid
Login
admin
Username
dan
a. Jika berhasil maka
masuk halaman
Valid
55
dengan klik
tombol
login
Password manage data dengan
hak akses sebagai
admin
b. Jika password salah
maka akan muncul
peringatan password
salah
c. Jika username salah
maka akan muncul
peringatan username
salah
b. Pengujian untuk halaman menu-menu yang dapat diakses oleh
user meliputi pilihan kategori, dan lihat album. Dari pengujian
yang dilakukan didapat kesimpulan bahwa menu-menu yang
ada telah berjalan dengan baik.
Tabel 4.2 Pengujian Blackbox halaman menu user
Aktivitas
dan
Event
Input Output Status
Pengujian
Pilih
kategori
Building
Jika berhasil maka
masuk halaman
pertanyaan dari kategori
building.
Valid
Pilih
kategori
Water
Jika berhasil maka
masuk halaman
pertanyaan dari kategori
water .
Valid
56
Pilih
kategori
Energy
Jika berhasil maka
masuk halaman
pertanyaan dari kategori
energy.
Valid
Lihat
album
dengan
klik link
album
Jika berhasil maka akan
masuk ke halaman
album.
Valid
Lihat list
chart
Pilihan
kategori
dari setiap
pertanyaan
Jika berhasil maka akan
masuk halaman list
chart.
Valid
Create
new user
Username,
password,
address
a. Jika berhasil maka
akan masuk ke
halaman home.
b. Jika gagal maka akan
muncul informasi
kesalahan format
inputan username,
password, dan email
address.
Valid
Change
password
Current
password
dan new
password
a. Jika berhasil maka
akan masuk ke
halaman home.
b. Jika gagal maka akan
muncul informasi
kesalahan format
inputan password.
Valid
c. Pengujian untuk halaman menu-menu yang dapat diakses oleh
admin meliputi view data, insert data, edit data, delete data,
pilihan kategori, dan lihat album. Dari pengujian yang
dilakukan didapat kesimpulan bahwa menu-menu yang ada
telah berjalan dengan baik.
57
Tabel 4.3 Pengujian Blackbox halaman menu admin
Aktivitas
dan Event
Input Output Status
Pengujian
View data Username dan
password
a. Jika berhasil
maka masuk
halaman manage
data.
b. Jika gagal akan
muncul informasi
username atau
password salah.
Valid
Insert data Memasukkan
Category,
QuestCategor
y, Title,
Nominal dan
DisplayArtUrl
a. Jika berhasil
maka masuk
halaman manage
data.
b. Jika gagal akan
muncul informasi
kesalahan dalam
format inputan
data.
Valid
Edit Data Memasukkan
Category,
QuestCategor
y, Title,
Nominal dan
DisplayArtUrl
a. Jika berhasil
maka masuk
halaman manage
data.
b. Jika gagal akan
muncul informasi
kesalahan dalam
format inputan
data.
Valid
Delete data Jika berhasil maka
akan masuk ke
halaman delete
confirmation.
Valid
58
Pilih
kategori
Building
Jika berhasil maka
masuk halaman
pertanyaan dari
kategori building.
Valid
Pilih
kategori
Water
Jika berhasil maka
masuk halaman
pertanyaan dari
kategori water.
Valid
Pilih
kategori
Energy
Jika berhasil maka
masuk halaman
pertanyaan dari
kategori energy.
Valid
Lihat
album
dengan klik
link album
Jika berhasil maka
akan masuk ke
halaman album.
Valid
Berdasarkan pengujian yang telah dilakukan didapatkan
hasil bahwa aplikasi ini sudah berjalan secara fungsional dan
mengeluarkan informasi sesuai dengan yang diharapkan.
59
4.3 Analisis Aplikasi
Sistem yang dibangun merupakan sebuah aplikasi web
properti yang menitikberatkan informasi kepada user mengenai
nilai jual dari fitur bangunan yang user miliki. Selain itu aplikasi
ini juga memberikan informasi kepada pihak pengelola mengenai
data dari penjual (khususnya member dari Valencia Residence)
sehingga pihak pengelola telah memiliki gambaran letak, bentuk
dan fitur dan juga nilai jual dari bangunan tersebut. Dari fitur-fitur
yang dimiliki, user akan mendapatkan keuntungan nilai jual dari
harga semestinya. Ada tiga aspek yang mempengaruhi dari nilai
jual bangunan yang dimiliki.
Aspek pertama adalah fitur bangunan. Sebagai contoh bentuk
bangunan secara default tidak memiliki kolam ikan pada badian
depan atau belakang bangunan. Dengan adanya penambahan
kolam ikan tersebut, maka nilai jual bangunan akan bertambah
sesuai dengan nilai jual dari bagian pemasaran.
Aspek kedua adalah fitur air. Sebagai contoh sumber air yang
digunakan bersumber dari PDAM (Perusahaan Daerah Air
Minum). Dengan penambahan sumber air berupa sumur, maka
nilai jual akan bertambah sesuai dengan nilai jual dan spesifikasi
teknis alat pompa.
Aspek ketiga adalah fitur energi. Sebagai contoh sumber
tegangan listrik berasal dari PLN (Perusahaan Listrik Negara)
dengan daya tertentu. Jika sumber tegangan dari PLN padam,
maka akan mengganggu aktifitas dari pemilik rumah. Dengan
adanya fitur energi lain yaitu berupa generator, maka akan
membatu pemilik rumah dalam beraktifitas.
60
Dari ketiga fitur tersebut, akan mempengaruhi nilai jual dari
bangunan serta menjawab pemikiran dan persepsi masyarakat
terhadap tingginya nilai jual dari bangunan.
4.4 Analisis Performansi
Hasil analisis performa dari MVC 3.0 yang dilakukan dengan
testing berdasarkan aspek kecepatan (time/milisecond) dan aspek
memori (kilobyte). Berikut hasil analisis performa kecepatan dari
MVC 3.0.
Gambar 4.14 Report hasil analisis kecepatan
Dari Gambar 4.14, terdapat grafik yang menunjukkan
penggunaan resource dari processor saat menjalankan perintah-
perintah berdasarkan permintaan user. Rata-rata penggunaan
resource dalam 1detik mencapai kurang lebih 50% dari total
resource yang ada. Dari tabel, ditunjukkan bahwa proses dalam
menjalankan perintah untuk menampilkan halaman home adalah
sebesar 6.877 milisecond, untuk menampilkan halaman login
61
adalah sebesar 1.255 milisecond, dan proses menjalankan layout
web sebesar 2.530 milisecond
Gambar 4.15 Tampilan hasil analisis alokasi memori
Dari Gambar 4.15, terdapat grafik yang menunjukkan
penggunaan resource dari processor saat menjalankan perintah-
perintah berdasarkan permintaan user. Rata-rata penggunaan
62
resource dalam 1detik mencapai kurang lebih 50% dari total
resource yang ada. Dari tabel, ditunjukkan bahwa alokasi memori
dalam menjalankan perintah proses doublequery adalah sebesar
39.85% dari total keseluruhan, untuk proses update dan save data
adalah sebesar 8.68%, dan proses untuk singlequery sebesar
6.14%. Sedangkan untuk alokasi dari tipe data yang ada yaitu
string, char, dan int adalah 14.95%, 7.96% dan 4.71%.