Content Management System

Introduction

People are always in need of doing shopping, especially the women wants to go shopping when they feel depressed or unhappy. 30% of the ones who do shopping over Internet do the shopping with their smartphone according to some statistics. That means applications become more common and the most important thing to notice is that people carry always their smartphones with them. In our project, the owner of the shopping mall (Oakdale Mall) in Johnson City is also aware of the importance of being integrated with the technology; therefore they requested an application for both iOS and Android for their shopping mall.

What is a Content Management System

It is a web application designed to make it easy for non-technical users to add, edit and manage an application. It manages any content, edits your content dynamically and manages your design. Then we integrate and publish the iOS and Android applications with the data entered by the shopping mall owners in the web application.

Purpose of the Project

The main objective of this project is to implement a dynamic shopping mall application working on both Android and iOS operating systems. The administrators of the shopping mall are able to enter their information with the help of the dynamic web application whenever they want. Every data entered into the system will automatically be showed in the application by means of the web service in the iOS and Android operating systems. Additionally, the application copes with the difficulties in lacking of the internet. It is able to show the up-to-date information to the user every time. We ensure that the customers have the most current data and also we ensure the best way to benefit from the shopping mall. The customers can get the saving announcement instantly, there is a raffle, and you go into that raffle immediately. Legally we are not responsible of the data, since the data is entered by the owners of the shopping mall.

Design

Hardware, Software and Human Interfaces

Hardware Interfaces

The project is composed of 3 applications.

• Dynamic Web Application
• Web Service
• Android and iOS Application

For web application and web service usage a PC is required.

For iOS application an iPhone is required.

For Android application an Android device is required.

Software Interfaces

1. For Web Application and Web Service:
   • PHP and PHP Zend
   • HTML5 and HTML
   • CSS3
   • JavaScript
   • jQuery
2. For iOS Application:
   • C, Objective C
   • Core Image
   • Core Location
   • Core Graphic
   • Core Text
   • Core Data
   • Quartzcore
   • Core Animation
   • Google Weather API
   • Google Geocoding API
3. For Android Application:
   • Java
   • JavaBeans
   • Yahoo Weather API
   • Google Geocoding API
   • SQLite
   • Open GLS
   • Third party graphic and animation libraries
   • Third party GUI designs (segmented radios...)

User Interfaces

Dynamic Web Application

This application is a dynamic web application and content management system of a shopping mall working on Windows operating systems. The users of this application are the administrators of the shopping mall. The dynamic web application is a bridge between mobile applications and the database. With the web application, it can be done:

• Add new records
• Delete records
• Update records

---

• They are able to enter the system with their username and password which are given them before.

• The user is able to add a new record, delete or update a record in every table.

• The system is UTF-8 supported.

• Passwords are encrypted with md5, crc32, sha1.

• There is dynamic language support.

           Login Page:   | Sidebar:   |

A sample page from Web Application:

The Language page showing that the languages can be inserted dynamically:

A sample page with the Sidebar and you can see that the application is UTF-8 supported in the dropdown menu:

The page showing the table of the floorplan including with the images:

The page when you edit a record from a table:

When the user attempts to reach the page without logging in or after he has been logged out:

it gives an HTTP 404 error

In the dropdown menu, you can see that the data is dynamically created:

Web Service

A web service program implemented in the .NET environment. Over the mobile devices the information which is created by the user in the Dynamic Web Application can be retrieved. The web service is used for retrieving the data in the database. First the data in the tables are accessed, and then these data are returned as a JSON model, which are then retrieved by the mobile applications. These retrieved data (JSON data) by the mobile application are then parsed into strings. Following screenshots are the JSON data retrieved by the web service from the database:

The entrance page, where the tables are shown, of the web service:

The data from a table are shown as JSON models as the following:

iOS and Android Application

This application will be designed to be developed for both operating systems Android and iOS. The user will be checked whether he is connected to the Internet or not. During the first use of the application, all the data found on the web service are loaded into the application. After the first use, if there is an Internet connection, the application loads the updated data to itself. Otherwise the data, loaded into the web service from the last Internet connection, are going to be showed. Every item created dynamically on the console application has to be created in iOS and Android applications (like WordPress), because from there the data is entered. It is like a mobile application version of the WordPress.

iOS Application

• Login:

All the data is loaded from the database through web service and the user is asked to choose a language.

• Campaigns and Events Tab:

The campaigns and events can be shared through Facebook or Twitter.

• Cinema Tab:

The user is able to see both the upcoming and in theaters feature from the cinema tab.

• Contact Tab:

Our application is user-friendly. Every user is able to call the number, add the number to the contact or even copy it, once the uer clicks on the phone number.

• Floorplan Tab:

Floorplan image can be seen by the mobile application users and the users can zoom in to magnify the picture and zoom out to see more of the picture.

• Park Tab:

Indoor and Outdoor Parking. The users are able to save the location of where they have parked their car. They can enter the information of the place they have parked. They can even choose a color when saving their park location. The results are seen in longitude and latitude and then the user is able to see the directions information from the place they are to the place they have parked their car.

• Restaurants Tab

The user is able to see the listing of the restaurants and also can see the contact information of the restaurants. By clcking on the phone numbers, they can even call or save the contact information.

• Services Tab

• Store Categories:

Ther user can pick a store category and the se the related store listings. By clicking the desired store, the user can retrieve the data of that store.

• Survey Tab:

Survey questions and preparing the pdf of the survey analysis.

• Taxi Tab:

Taxi listings.

• Weather Tab:

The weather forecast.

Android Application

Project Tasks

The work breakdown structure is as the following:

Problems Encountered

• We have developed the Content Management System as a web application. At first, actually, we started to develop it as a desktop application, because we believed that implementing the desktop application is much easier. Then we realized that implementing the Content Management System as a web application is more beneficial for the shopping mall owners. Web applications can be easily accessed from every computer while desktop applications should be installed on each computer.

• At first, the web service was implemented in the .NET environment, but then we changed it to the PHP, because the hosting company (www.fatcow.com) does not support Microsoft environment (.NET platform).

Team Members

These applications are developed by Hasan Cem Dertli and Tansu Sagdic as a senior project.