Document

1
Chapter 1
INTRODUCTION
In the digital age where everyone is connected to their friends, family, and colleagues
there is a need to know what projects people are working on and discuss them in more
details in one – to – one meeting. The best way to achieve this goal is when in a company
a group gathers around in an annual summit and there is sufficient timeslots dedicated for
this purpose. This is a great opportunity for attendees to network with each other, seek
mentorships, understand how other groups can help them with their business, realize what
are interesting projects others work on, or simply catch up with old friends.
One way to schedule meetings is through Microsoft Outlook, however when the list of
people one wishes to meet with gets long, it can be very tedious and time consuming.
Attendees need to check their person of interest’s schedule for their availability and
create a new meeting request, cancel, or update previous requests. Each of these tasks
requires multiple steps which might results in members not using dedicated networking
timeslots. Also, Outlook does not have a social media aspect to itself. The need for an
application that satisfies both scheduling and social media aspect of this situation as well
as adhering to enterprise security guidelines for preventing security breaches rises in this
situation. The intended application not only should be easy to use but also should reduce
turnaround time. This application needs to provide attendees with a list of participating
members, detailed information on each of them, and a hassle – free meeting scheduling
2
system. A web – based application which not only provides updated information about
attendees but also makes meeting requests simple and easy will meet our expectations.
In this report we discuss the reasons for developing an online solution, the technology
used in this project, the architecture of this tool, the implementation and different
components of the tool and how they interact with each other, the process of deploying a
web – based tool and the maintenance after deployment, and further enhancements.
This report is organized as follows. Chapters 1 and 2 discuss the reason why this tool has
been developed. In chapter 3 technology used in this project is introduced and it also
discusses why ASP.NET MVC3 is a good approach for the issue we are trying to tackle.
Chapters 4 and 5 elaborate architecture and implementation in more details. Chapter 6
explains the deployment process and why there is a need for continuous integration.
Chapters 7 and 8, discuss performance analysis and grounds for further enhancements.
3
Chapter 2
BACKGROUND
This web – based scheduling system is built on a three – tier architecture. The three – tier
architecture is a client – server architecture where user – interface, business logic, and
data access layer are implemented and maintained independently. This web - based
application uses ASP.NET MVC 3 for front and middle layer and Microsoft SQL for
backend layer. The web browser sends request to web server, handles the request and
passes the parameters to the application tier. The middleware receives request from
application layer, query and update the database. The result will be sent back to
application layer and visible to user.
The need to implement an in house application for an annual summit instead of using
commercial tools is based on following reasons:
1. Tools such as TimeTrade (TimeTrade Systems, Inc. Tewksbury, MA) [1] although a
nice interface stills requires multiple steps like Microsoft Outlook for setting up
meetings.
2. Appointment-Plus (Appointment-Plus Inc. Scottsdale, AZ) [2] only supports limited
number of people which is much less than what is needed for this project.
3. ScheduleOnce (ScheduleOnce) [3] cover both social media and meeting scheduling.
However, it makes meeting scheduling easy only for group meetings, not for our
purpose. Also, since there is monthly subscription the cost escalades quickly.
4
Proposed web – based application is developed to meet the following criteria:
1. Integrate social media and meeting scheduling in one application.
2. Filter attendees based on name, location, and departments.
3. Drag and drop picture of person of interest to available timeslots and synchronize
Microsoft Outlook calendar all in one page, which eliminates the process of setting up
or canceling meeting requests in Microsoft Outlook.
4. Update or cancel meetings either through this application or Microsoft Outlook.
5
Chapter 3
TECHNOLOGY USED IN THIS PROJECT
In this chapter the architecture of this application and its hardware, software requirements
are discussed in more details.
3.1
Project Structure
This web – based application is built in Visual Studio 2010 ASP.NET MVC 3, which is
part of ASP.NET framework, that implements model – view – controller pattern [4].
ASP.NET MVC is a framework for implementing web applications. This pattern is an
architectural design which separates modules of a standard web application [5]. Model –
View – Controller was first introduced in 1979 named Thing – Model – View – Editor,
and later was changed to Model – View – Controller. This pattern fits perfectly when it
comes to designing web – applications, where we want to separate data from what users
see and how this information is being manipulated. ASP.NET MVC 1.0 was initially
released on March 13th 2009, and a year after that ASP.NET MVC 2.0 and just only after
10 months APS.NET MVC 3 was shipped out. ASP.NET MVC 3 which is referred to
MVC 3 added more features such as Razor View Engine, JavaScript and jQuery support.
3.1.1
Controllers
They are in charge of processing user requests, which means when user requests
some sort of action, for instance filtering attendees by their department,
controllers interact with models to retrieve necessary data from database and
render the results to users using views. Getting attendees schedule, sending and
6
canceling meeting requests, filtering attendees based on name, location, and
departments are number of functions implemented in C# in this project.
3.1.2
Views
They handle the user – interface portion of this project. They are created based on
model data. Each page or even each section of one page may have different look
and feel to them. Their purpose is to present the data passed to them from
controller to user, usually using HTML markup. The views in this project are
Razor View Engines.
3.1.3
Models
They are the logic section of MVC 3 pattern. They receive requests from
controllers and interact with database. They establish a connection to database and
retrieve and manipulate necessary table data in database and prepare the result for
users. The data structure of the projected is defined in this section. Models in this
project are written in C# and they retrieve information from database using
EntityFramework, which is a framework for accessing data within database [6].
7
Figure 1: MVC pattern [7]
According to [5] Model – View – Controller architectural pattern is a way to separate
different logic layers in an application. This feature is beneficial in web development
project. It is much easier to have business logic separated from display logic since the
design and layout of a web page tends to change more frequently than the data structure
of such application. Model – View – Controller architectural pattern is very similar to a
three – tier architecture which is a client – server architecture where different layers are
independent from each other. A three – tier architecture is described as follows:

Display Logic: This is the presentation layer of the application which means after
the user submit his request it will render a graphical user interface (GUI) for
displaying results. This layer is similar to Views in ASP.NET MVC3.
8

Business Logic: The data structures of the project, business rules, and data
manipulation are defined in this section. This layer is similar to Models in
ASP.NET MVC3.

Data Access Logic: This layer is in charge of data handling, which means it
allows business logic tier to access databases on data servers.
Figure 2: 3-tier architecture [8]
The main difference between MVC and three – tier architecture is that, in latter business
logic is only accessed by display logic and has access only to data access logic; however
in MVC controllers have accesses to both views and models.
9
3.2
Technology Overview
3.2.1
AJAX (Asynchronous JavaScript and XML)
AJAX is not a programming language rather a technique that gathers different
technologies such as DOM, JavaScript, CSS, and HTML in order to create a better
user experience [9]. In conventional web applications following events occur upon
user’s request:

The browser makes an HTTP request to web server.

The web server queries the database.

The web server performs necessary calculations and manipulations to prepare
the results.

The web server responds to web browser with an entirely new HTML page
[10].
When a button is clicked AJAX works as follow:

JavaScript code is executed that handles asynchronous calls to web server.

The web server queries the database and performs needed calculations in
background.

The web server sends only a section that contains new information to web
browser instead of sending a brand new HTML page.

JavaScript updates the user interface with new information using CSS for
styling [10].
10
Figure 3: Traditional vs. AJAX web application [10].
3.2.2
jQuery
jQuery is a JavaScript library which means it is a JavaScript file containing
jQuery functions. These functions manipulate HTML attributes to create a more
dynamic and interactive web application. The advantage of using jQuery is that it
eliminates concerns about different browser.
3.2.3
Language Integrated Query (LINQ)
LINQ is a tool for embedding SQL queries in source code [11]. There are three
parts to a LINQ query [12].
11

Obtain data source

Create the query

Execute the query
Regardless of what type of data source (XML document or SQL tables) we are
trying to query, LINQ offers a uniform syntax [11]. In order to reduce run time,
queries for this project is written in Lambda expression. For instance, in order to
retrieve all existing reservations form Reservation table in database a single line
of Lambda expression is written
List<Participant> ListTotalScheduled =
context.Reservations.Include("Participant").Select(x =>
x.Participant).OrderBy(x=>x.LastName).Distinct().ToList();
This query joins Reservation and Participant tables, retrieve distinct names (to
eliminate any duplicates, since each person can schedule more than one meeting )
and order the result by last name of the participant who has requested the meeting
and store the result in a list of type Participant (a user – defined data structure).
12
Chapter 4
ARCHITECTURE
In this chapter the structure and architecture of the project is discussed in more details.
The design of the system as a whole, different components, interactions with each other,
and major challenges are examined.
Upon loading the website a user can perform following actions:

Update his/her profile information.

Filter summit participants based on geographical location or department.

Search attendees based on their names.

View attendees’ detailed information.

Modify previously scheduled meetings.

Schedule new meetings by drag and drop attendees’ pictures to available slots (for
both parties).

4.1
Sync his/her Microsoft Outlook calendar with a click of a button.
Data Flow Diagram
Data Flow Diagram (DFD) is a graphical representation of how data is used and
manipulated throughout the structure of the project [13]. It describes where input comes
from and what are the processes applied to input and how the result would be handled. In
this project input could be a time slot and an attendee’s name user wish to meet. They are
13
the external data provided to the system. The following diagram represents data flow of
create/update/cancel meetings:

Query the database to check participant’s availability.

If the participant is free, make new reservation and assign his/her ID to that time
slot and update his/her availability in database.

Upon clicking Sync Outlook button, send .ics calendar invites to their email
addresses with default subject, message and location.
14
Figure 4: Data flow for create/update/cancel meeting request
15
Figure 5: Scheduling a meeting with a participant
Figure 6: Cancelling a meeting
16
The following diagram shows data flow for filtering participants based on their
geographical location or department:

Select a geographical location or department from drop down list

Query the database to satisfy the condition selected

Update the view to show only participants with those criteria
Figure 7: Data flow for filtering attendees based on location or department
17
Figure 8: Filtering attendees based on their department
Figure 9: Filtering attendees based on their location
18
The data flow for update profile is as follow:

Upon clicking on update profile link a window will pop up.

Users can upload a new photo and describe their role or a project they are
working on and are excited about.

By clicking the update button, all changes are applied and stored in the database.
Figure 10: Data flow for updating profile
19
Figure 11: Updating profile
4.2
Database Design
Before the existence of database concept, information was stored in files. The challenges
faced when using such system is data redundancy, integrity, security, and etc. According
to [14] no matter how information is stored there are four actions to be executed on it:

Read

Write

Update

Delete
20
The reasons that database is used here instead of file system are data integrity, security,
and independence.

Data integration refers to assembling different data (such as name, department,
and location) from multiple data sources to provide unified information to users.
For instance department ID in Participant table is derived from Department table.
When providing this information to user, he/she does not know where this data
has come from but rather for each participant there is one and only department ID.

Security risks threating database could be unauthorized personnel accessing
summit attendees’ information, environmental hazards, and computer viruses. By
storing this project’s database on a secure server and defining different roles for
summit attendees and application developers these risks are handled.

Data independence means the ability to change data without having to modify the
source code. The source code would not change if data type for any row of data
base is changed, or if we add indexes to database.
21
Following is the entity relation (ER) diagram for this project:
Figure 12: ER diagram of the project
22
Chapter 5
IMPLEMENTATION
In this chapter a more in depth description of functions, classes and the role they play are
given. When an ASP.NET MVC 3 application is created in Visual Studio 2010 Content,
Models, Scripts, Views and Controllers folders are generated automatically and will be
further defined to fit the purpose of this project. The Images and Helpers folder are
created manually specific to this project.
Within each folder there are multiple classes in different programming languages which
implement different functionalities of this web – based application.
5.1
Content
Content folder includes all cascade styling sheet files (CSS). CSS files are created in
order to have consistent styles throughout our web – application. Each element that will
appear on the website has its own design, in order to eliminate inline styling and make
maintenance easier different cascade styling sheet files are created. For instance the size
of each image, the format of the calendar, and the font of different parts of text are
declared here.
Home.css
body {
define background-color;
define font;
define color
}
23
#calendar {
define position;
define margin;
}
.collapsible {
define position;
}
.meeting-days {
define color;
define font;
define border;
define txt;
}
#search {
define txt;
define size;
}
Profile.css
#profile-picture {
define size;
define padding;
define margin;
}
jquery.qtip.min.css is a library from [15] which is used to create customized tooltip.
.tooltip {
define font;
define icon;
define color;
define position;
define size;
}
24
5.2
Helpers
Helpers folder contains functions for manipulating data retrieved from the database. The
reason such folder is created is to keep Controllers as clean as possible for maintenance
purposes.
ICSHelper.cs
string BuildMeetingRequest (int id, Participant p1, Participant
p2, MeetingTime Timslot) {
create a meeting request in .ics format
return the meeting in string format at the end
}
string BuildCancelMeetingRequest (int id, Participant p1,
Participant p2, MeetingTime Timeslot) {
create a cancel meeting request in .ics format
returns the meeting in string format at the end
}
void SendICSInvite (int id, Participant p1, Participant p2,
MeetingTime Timeslot) {
call BuildMeetingRequest (id, p1, p2, Timeslot);
create a MailMessage object and send the meeting request
using SmtpClient;
}
void SendICSCancellation (int id, Participant p1, Participant p2,
MeetingTime Timeslot) {
calls BuildCancelMeeetingRequest (id, p1, p2, Timeslot);
creates a MailMessage object and sent the request using
SmtpClient;
}
25
ImageHelper.cs
bool IsJPEG (string filename) {
check to see if the picture file user is trying to upload
in .jpeg format;
}
void DeleteFile (string filename) {
deletes an image file;
}
object UploadPicture (HttpServerUtilityBase Server,
HttpPostedFileBase file, int ParticipantId) {
determine browser type;
save the new image with the same name of existing image
with –upload.jpg at the end;
save the new image on a temporary location;
if user confirms changes then
replace old image with new one;
rename the new image and remove –upload from it;
return true;
else
return false;
}
object ConvertAndSaveImage (Stream stream, string filename) {
if the image is not in .jpeg format then
convert the image to mentioned format and upload it to
the server;
}
MeetingHelpe.cs
bool IsParticipantFree (CAG1on1Entities context, int
ParticipantId, int MeetingTimeId) {
creates a connection to database;
26
query the database to see if participant with ParticipantId
is free for the given timeslot;
}
string FormatMeetingTime (DateTime datetime) {
convert the datetime from DateTime format to string format;
}
List<Reservation> GetReservations (CAG1on1Entities context, int
ParticipantId) {
creates a connection to the database;
get all the reservation for the participant with
ParticipantId using Lambda query;
}
void SendMeetingInvites (int ParticipantId) {
creates a connection to the database;
query the database to get all the reservation for
participant with ParticipantId;
if the participant is free then
SendICSInvite (id, p1, p2, time);
update the database;
}
void SendMeetingCancellation (Reservation reservation) {
foreach attendee
SendICSCancellation (id, p1, p2, time);
}
5.3
Images
This folder contains all images for this year’s event in .jpeg format.
27
5.4
Models
Model folder contains C# classes that describe logic and data structure of this project.
Participants’ information such as name, email, department, and etc. are stored in user
defined lists to be utilized when querying the database.
ExtendedParticipant.cs
string Firstname {
validate the first name of the participant;
the length of first should be within an acceptable range;
}
string Lastname {
validate the last name of the participant;
the length of last name should be within an acceptable
range;
}
string Description {
validate the description that participant has entered;
the length of description should be within an acceptable
range;
}
HomeViewModels.cs
List<Participant> GetParticipants (int DeptId, int GeoId) {
establish a connection to database;
query the database selecting only participants that belong
to a specific geographical location and department;
return the result in List;
}
List<Participant> GetParticipantsBySearch (string term) {
establish a connection to database;
28
query the database to find the attendees whose names
contain term;
return the result in List format;
}
5.5
Scripts
This folder contains both customized and standard JavaScript, jQuery, and AJAX scripts.
In main.js file there is a main function that performs all requests from client side and
submits those requests to server side.
$(function () {
DetectBrowserVersion () {
detects the version of browser, this application
supports IE 7 and up, FireFox, and Chrome
};
SetDraggableRegions () {
when a participant’s picture is selected update the
calendar based on his/her schedule to reflect his/her
availability;
if user assigns that participant to a timeslot then
schedule a meeting;
else
send picture back to its original position;
reset necessary changes;
};
RetrieveSchedule () {
if there are existing reservations then
show schedule on calendar;
else
show an empty calendar;
};
SetToolTips () {
29
on mouse hover over a participant picture, show
his/her name, geographical location, department and
description;
on mouse out remove the tooltip;
};
Droppable () {
if an image is hovering over a timeslot then
change timeslot background color;
if that timeslot is empty then
schedule a meeting;
give confirmation;
append a delete icon to the right corner of the
image;
stick image to that timeslot;
else
alert user that he/she already has a meeting
during that time;
reset necessary changes;
};
MeetingDays () {
load calendar on expanded mode with minimize icon on
the top left corner of each day;
if minimize icon is clicked then
minimize that specific day;
hide all timeslots;
hide all images assigned to timeslots within that
day;
change the minimized icon to maximize icon;
if maximize icon is clicked then
maximize that specific day;
show all timeslots;
show all pictures assigned to timeslots during
that day;
30
change maximize icon to minimize icon;
};
PopUp () {
create pop up box with custom message;
};
SearchBox () {
use autocomplete function in jquery to retrieve a list
of participants as user types in characters;
};
Filter () {
retrieve the value from drop down menu;
SetDraggableRegions ();
SetTooltips ();
}
SyncCalendar () {
sends the updated schedule back to server using POST
method;
};
}
5.6
Views
View folder contains different classes which with the help of CSS, JavaScript files and
Razor Engine syntax define the layout of pages to be displayed to user. For each element
on the website there is a specific view. Every time user submits a request, necessary
information will be retrieved from database. After data manipulation the result will be
displayed to user. How this result is organized is defined in View folder. The main view
is Index.cshtml.
31
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
load necessary .css files
</head>
<body>
provide user information about different sections of the
website, such as where to update profile, how to schedule
meetings, and etc
render views for different parts of the web page
<script> call necessary .js files
</script>
</body>
</html>
5.7
Controllers
Controller folder contains different C# classes which with the help of Models handle
user’s requests. Every action has a method defined in Controller folder. When user wants
filter attendees based on their locations, the location name will be passed to a method in
controller as an input and necessary information will be retrieved from the database for
further manipulation.
Index () {
get user’s credentials;
load the main page;
}
FilterByDropDown (string DeptId, string GeoId) {
if user applies a filter then
calls associated Model and View;
32
return results;
}
CreateReservation (int AttendeeId, int TimeslotId) {
establish a connection to database;
if both parties are available then
create a reservation;
send confirmation;
apply necessary changes;
return true;
else
return false;
}
CancelReservation (int TimeslotId) {
establish a connection to database;
retrieve the ID of the participant who is trying to cancel
the meeting;
send confirmation;
update calendar;
return true;
}
RetrieveSchedule () {
retrieve the ID of the user;
establish a connection to database;
query the database to retrieve participant meeting
schedule;
foreach reservation in database
mark the participant busy;
}
Search (string term) {
get a list of all participant whose name contain a
substring of term;
return the list;
}
33
UpdateProfile (Participant p) {
render necessary view;
get all fields values with new data;
use ImageHelper.cs to upload new image;
if successful then
return true;
else
return false;
}
SyncWithOutlook () {
get user Id;
send meeting invites;
alert user;
}
34
Chapter 6
DEPLOYMENT
In order for summit’s participants to access this website this application should be
deployed on a specific server. For a web application to work properly there should not be
any broken links or any incorrect string connection for database. It would cost huge
amount of resources to check all necessary fields and update changes every time
application goes through a testing phase, and if they are done manually there is a lot of
room for human errors. To prevent this type of situations an environment is built to
execute this process automatically every time there is a change in project.
6.1
Source Control
It is very common to make changes either small or big in a project and later that change
needs to be reversed. To manage these situations it is best to use some sort of version
control. The source control used in this project is a free open – source Windows client for
the Apache Subversion version control system [16]. This means TortoiseSVN is a
repository that manages all files checked in to it, and keeps track of changes, who, when,
and why those changes were made, in case they cause breakage in system.
6.2
Continuous Integration System
“Continuous Integration is a software development practice where members of a team
integrate their work frequently, usually each person integrates at least daily—leading to
multiple integrations per day. Each integration is verified by an automated build
35
(including test) to detect integration errors as quickly as possible. Many teams find that
this approach leads to significantly reduced integration problems and allows a team to
develop cohesive software more rapidly.” [17]. CruiseControl.NET is an open source
automated continuous integration server, implemented using the .NET framework [18].
CruiseControl consist of following applications:
6.2.1
CruiseControl.NET server
The server automates the integration process by checking the repository. Every
time there is a change CCNET triggers a build. After the build is over it will send
a report indicating whether the build was successful or not. Following is a list of
CCNET features [18]:

Integration with a variety of Source Control systems (vss, csv, svn, git, hg,
alienbrain, bitkeeper, perforce, clearcase, filesystem, ftp, and etc.)

Integration with other external tools, such as NAnt, Msbuild, NDepend,
Nunit, MBUnit, Watin, Visual Studio, and etc.

Can build multiple projects on one server

Remote management

Reporting: email, launch exe, rss, and etc.
36
6.2.2
WebDashboard
The web dashboard shows a list of all projects. Each entry represents server,
project name, last build status, last build time, next build time, last build label,
CCNet status, activity, messages, and build options (force, abort, and stop).
For each project that is checked in to SVN there is an XML script (nant.build) that
defines the following criteria:

The path the project is located

The path this project is going to be deployed

Which files are going to be deployed and the location they are going to
be deployed
6.3
Migration Utility (MU3)
MU3 is a migration platform that can be used to securely deploy a project from one
environment to another. There are different staging areas to meet different needs. The
challenge is to deploy this application to different environment without breaking the
system. The first staging area is similar to the local system where the code is developed,
as it progress further those environments mimics the behavioral of final application. This
means the final database and web application could be hosted on separate servers and if
the connection strings, or log in credentials are not valid the application will not work
37
properly. There are other factors such as number of users trying to access this web site at
any given time would cause a problem or not.
Figure 13: Flowchart of continuous integration
38
Chapter 7
PERFORMANCE ANALYSIS
In this chapter performance of this tool is discussed to evaluate the impact of the web –
based scheduling system in the team annual summit.
7.1
Visual Appeal
As demonstrated below it is upon visiting the website user can easily scan through
participants list, update his information, filter attendee’s based on location, name or
department, synchronize his calendar, create, cancel and update meetings. All of these
actions are in one page and there is no going back and forward between multiple pages.
39
Figure 14: Homepage of CAG1on1
Upon clicking on “update your profile” link, a popup page will appear and user can
confirm changes or cancel out of it, without having to reload the homepage.
40
Figure 15: Update profile window
7.2
Measurement Scale
The initial testing was done in a group of 12 participants. They believed this tool reduced
the process of scheduling meetings significantly. Also, by updating their information they
had a way to inform other participants what their roles is and what there are excited
about, which was not available before. “This is such an easy tool to use, I have
everything I need in one page, and that’s it! I don’t have to go back and forth between the
address book and my calendar to see who is available and when” was a point made by
majority in the test group. This application was used by 95% out of 176 of total
participants during this year summit. The feedback was positive indicating “The tool was
41
easy to use and raised the productivity for attendees. As a result, customer satisfaction
was rated high.” which resulted in global recognition.
7.3
Security
This application was developed in house, which means only people inside of the
enterprise have access to it. Also, there is a permission check for executing each action
which won’t let anyone besides the participants of this year event access the tool. This
level of security prevents any type of security breaches. If we were to dedicate a group in
other social media network such as Facebook, we could face issues such as, some
participants might not have Facebook account or they do not mix their private life and
work life. If everyone had agreed to use a Facebook group for this event they would still
have to switch between Microsoft Outlook and Facebook page to which could be a lot of
hassle.
42
Chapter 8
CONCLUSION AND FUTURE WORK
8.1
Summary
This web application intends to be a more efficient and user friendly tool for participants
of an annual summit for an enterprise. This tool not only provides an effective way for
meeting scheduling but also covers the social media aspect of the problem. Upon visiting
the website a user is presented with a list of this year attendees. If he/she wants to know
more about others he/she can simply hovers over their picture and a tooltip will appear
containing that person’s name, department, geographical location, and a summary about
what they do. If the user is interested to schedule a meeting with a particular participant
he/she drags that person’s photo and assigns it to a timeslot on the calendar where they
are both free. Every time a user selects a picture, calendar is automatically updated to
reflect the person of interest availability. After user is finish setting up meetings he/she
can synchronize their Microsoft Outlook calendar with a click of a button. A user can
cancel meetings by clicking on the “X” mark next to participant’s picture on each
timeslot and the system will automatically sends a confirmation email. A user can update
his/her profile information using the provided link so other attendees will have more
accurate information about him/her.
A user can also filter attendees based on department or geographical location if they are
interested. If he/she is looking for a specific person a search box is designed to
accommodate this need.
43
Scheduling meetings using Microsoft Outlook can be a very long and time consuming
task especially when it comes to multiple meetings. Also, it can be very frustrating to
update or cancel those meetings when needed. This project not only eliminated those
steps but also offered more. This project introduced the concept of mixing scheduling and
social media within the security guidelines of the enterprise. Attendees can share
information about their responsibilities and work projects without being concerned about
security breaches.
8.2
Future Work
This is a scalable project and can be used in different scenarios. This tool has offered
much more than scheduling meetings and in order to measure its impact in different
situations the following features could be added for enhancements:

An Administrator Page: This page would be designed for an individual or group
of people in charge of populating each year’s participants list. An administrator
will enter the unique ID (World Wide ID) for each attendee and system will
retrieve their names, emails, locations, departments. The administrator will have
permission to add or remove participants from the list.

A Report Page: This page will contain multiple lists, such as list of people who
have not used the tool, people who have not scheduled meetings, people who have
not synchronized their calendars, and etc. For each list there is an Email button to
notify those participants to take actions.
44
APPENDIX A
Creating Controller Class
using System;
using System.Collections.Generic;
using System.Linq;
using System.Security;
using System.Security.Permissions;
using System.Text;
using System.Web;
using System.Web.Mvc;
using System.Web.Script.Serialization;
using CAG1on1App.Helpers;
using CAG1on1App.Models;
using CAG1on1App.Security;
namespace CAG1on1App.Controllers{
[HandleError(ExceptionType = typeof(SecurityException), View =
"PermissionError")]
public class HomeController : Controller{
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public ActionResult Index(){
get user ID;
return View(new HomeViewModel());
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult FilterByDropDown(string DeptId, string GeoId){
establish connection to database;
query the database using DeptId and GeoId;
return results;
45
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult FilterByParticipantId(int id)
{
establish connection to database;
query the database using id;
return the result;
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult CreateReservation(int AttendeeId, int
TimeslotId){
establish connection to database;
if participant is free then
create reservation;
save changes;
return True;
else
return False;
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult CancelReservation(int TimeslotId)
{
establish connection to database;
query the Reservation table using TimeslotId;
delete the reservation;
send cancellation emails;
save changes;
46
return True;
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult RetrieveSchedule()
{
establish connection to database;
query the Reseration table using ParticipantId;
foreach reservation
mark calendar as not available;
return True;
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public string Search(string term){
append what user is typing to create a string;
establish a connection to database;
query the Participant table to retrieve the necessary
information;
return the result;
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult UpdateProfile(Participant p)
{
establish a connection to database;
query the Participant table using p;
HomeViewModel.UpdateParticipant(participant);
update image;
save changes;
47
if successful then
return True;
return False;
}
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public ActionResult DisplayProfile(int id)
{
establish a connection to database;
query Participant, Dept and Location tables;
return View(participant);
}
[HttpPost]
[PrincipalPermission(SecurityAction.Demand, Role =
RoleNames.SiteAccess)]
public JsonResult SyncWithOutlook()
{
get ParticipantId;
MeetingHelper.SendMeetingInvites(ParticipantId);
return Json("alert('Your Outlook calendar is now
synchronized.');");
}
48
APPENDIX B
Creating Model Class
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using CAG1on1App.Helpers;
namespace CAG1on1App.Models
{
public class Filter{
public Dictionary<string, string> DeptDropDownList { get;
set; }
public Dictionary<string, string> GeoDropDownList { get;
set; }
public string DeptFilter { get; set; }
public string GeoFilter { get; set; }
public Filter(){
DeptDropDownList = GetDeptDictionary();
GeoDropDownList = GetGeoDictionary();
}
private Dictionary<string, string> GetDeptDictionary(){
establish a connection to database;
Dictionary<string, string> dict = new
Dictionary<string, string>();
foreach dept in Dept
dict.Add(dept,”0”);
return dict;
}
49
private Dictionary<string, string> GetGeoDictionary(){
establish a connection to database;
Dictionary<string, string> dict = new
Dictionary<string, string>();
foreach loc in Location
dict.Add(loc,”0”);
return dict;
}
}
public class HomeViewModel{
public List<Participant> Participants { get; set; }
public List<MeetingTime> MeetingTimes { get; set; }
public Filter DeptFilter { get; set; }
public HomeViewModel(){
Participants = model.Participants;
MeetingTimes = model.MeetingTimes;
DeptFilter = model.DeptFilter;
}
public static List<Participant> GetParticipant(int id){
return HomeViewModel.Participants.Where(x => x.Id ==
id).ToList();
}
public static List<Participant> GetParticipants(int DeptId,
int GeoId){
if(DeptId != NULL) then
HomeViewModel.Participants.Where(x => x.DeptId ==
DeptId).OrderBy(x => x.LastName).ToList();
else if(GeoId != NULL) then
HomeViewModel.Participants.OrderBy(x =>
x.LastName).ToList();
}
50
public static List<Participant>
GetParticipantsBySearch(string term){
return HomeViewModel.Participants.Where(x
Contains(term));
}
}
51
APPENDIX C
Creating Main View Class
@model CAG1on1App.Models.HomeViewModel
@using CAG1on1App.Helpers
@using CAG1on1App.Models
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Title goes here</title>
all necessary CSS files are referenced here.
</head>
<body>
<noscript>
<h3>Alert user that JavaScript is disabled on their browser
and they should modify their settings</h3>
</noscript>
<div id="unsupported">
<h3>Alert user if their browser is not compatible with the
website. Ask them to upgrade to IE 8 or higher, Firefox or
Chrome</h3>
</div>
<div id="container">
<div id="title">
<h2>Welcome message!</h2>
<h4><font color="maroon">First</font>, please click
@Html.ActionLink("here", "UpdateProfile”) to update your
profile.</h4>
<h4>Instruction for creating and cancelling
reservations</h4>
</div>
52
@Html.Partial("Filter", Model.DeptFilter)
@Html.Partial("Search")
@Html.Partial("Sync")
<div id="profiles">
@Html.Partial("ProfilePictures", Model.Participants)
</div>
<div id="calendar">
@Html.Partial("Calendar", Model.MeetingTimes)
</div>
</div>
<script> JavaScripts are referenced here</script>
</body>
</html>
53
APPENDIX D
Creating Main JavaScript File
function RetrieveSchedule()
{
$.ajax({
define type,
define url,
define call back function;
});
}
function ClearAllReservations()
{
remove attendee’s picture from a specific timeslot;
}
function CreateReservation(attendee, timeslot)
{
$.ajax({
define type,
define url,
get AttendeeId and Timeslot,
define call back function;
var result = false;
});
}
function DeleteMeeting(timeslot)
{
alert user he is about to cancel a meeting;
if user confirms then
ClearAllReservations();
if successful then
display success message;
else
54
alert user there was a problem;
}
function CloneImage(dest, src)
{
resize the picture;
append the picture to the desired timeslot;
}
function AppendDeleteIcon(selector, timeslot)
{
append “X” to the right corner of the image;
}
function MarkAsBusy(attendee, timeslot)
{
upon dragging an image check which timeslot that attendee
is busy then make those timeslots unavailable;
}
function MarkAsReserved(timeslot)
{
when a timeslot is not available change the color of that
slot and display “Not Available” on it;
}
function SetDraggableRegions()
{
$(".draggable").draggable({
define which areas are draggable;
},
stop:{
release attendee’s picture;
}
});
}
55
function DetectBrowserVersion(){
check the browser version and display necessary
information;
}
function RemoveExistingToolTips()
{
when user is not hovering the mouse over a picture remove
the tooltip;
}
function SetToolTips()
{
when user is hovering the mouse over the picture show
necessary information, such as name, location, department,
and description if available;
make tooltips size dynamic so it is adjusted to amount of
content it has;
}
function UpdateDeptOrGeoFilter()
{
$('#SearchBox').val('');
$.ajax({
define type,
define url,
data: { DeptId, GeoId},
define call back function (data) {
RemoveExistingToolTips();
SetDraggableRegions();
SetToolTips();
}
});
}
56
APPENDIX E
Creating Main CSS File
a {
color: define color;
text-decoration: none;
}
a:hover
{
define specifications for tooltip
}
body {
define specifications for body
}
img {
define specifications for images
}
li {
define specifications for lists
}
table {
define specifications for tables
}
table td {
define specifications for table data
}
#calendar {
Define specifications for calendar id
}
.collapsible {
define specifications for collapsible class
}
#container {
define specifications for container id
57
}
#filter {
define specifications for filter id
}
.hover {
define specifications for hover class
}
.meeting-days {
define specifications for meeting-days
}
#profile {
define specifications for profile id
}
.reserved {
define specifications for reserved class
}
#search {
define specifications for search id
}
#sync {
define specifications for sync id
}
#title {
define specifications for title id
}
#unsupported {
define specifications for unsupported id
}
58
APPENDIX F
Creating Helpers Class
using System;
using System.Collections.Generic;
using System.Linq;
using CAG1on1App.Models;
namespace CAG1on1App.Helpers
{
public static class MeetingHelper{
public static bool IsParticipantFree(int ParticipantId, int
MeetingTimeId){
establish a connection to database;
query Reservation table using ParticipantId and
MeetingTimeId;
if the participant is free then
return True;
return False;
}
public static bool IsParticipantBusy(int ParticipantId, int
MeetingTimeId){
return !IsParticipantFree(ParticipantId, MeetingTimeId);
}
public static string FormatMeetingTime(DateTime datetime){
convert the system date to human readable date;
return result;
}
public static List<Reservation> GetReservations(int
ParticipantId){
establish a connection to database;
query Participant and MeetingTime tables;
retrieve all reservations;
return result;
59
}
public static void SendMeetingInvites(int ParticipantId){
establish a connection to database;
query Reservation table;
foreach reservation
send meeting invitations;
}
60
REFERENCES
1. TimeTrade [Online]. Available (http://www.timetrade.com/)
2. Appointment-Plus [Online]. Available (http://www.appointment-plus.com/)
3. ScheduleOnce [Online]. Available (http://www.scheduleonce.com/)
4. ASP.NET MVC3, [Online]. Available (http://msdn.microsoft.com/enus/library/gg416514(VS.98).aspx).
5. J. Galloway, P. Haack, B. Wilson, and K. S. Allen, Professional ASP.NET MVC
3, Publisher: Wrox 2011.
6. An Introduction to Entity Framework for Absolute Beginners, [Online]. Available
(http://www.codeproject.com/Articles/363040/An-Introduction-to-EntityFramework-for-Absolute-B)
7. ASP.NET MVC Overview, [Online]. Available
(http://www.asp.net/mvc/tutorials/older-versions/overview/asp-net-mvcoverview).
8. Br. Heathcote, 2011. 3. 5, All Things CS, [Online]. Available
(http://allthingscs.blogspot.com/2011/03/mvc-vs-3-tier-pattern.html).
9. AJAX Introduction, [Online]. Available
(http://www.w3schools.com/ajax/ajax_intro.asp)
10. R. Allen, K. Qian, L. Tao, and X. Fu, Web Development with JavaScript and
AJAX Illumination, Publisher: Jones & Bartlett Learning 2008.
11. P. Pialorsi, and M. Russo, Programming Microsoft LINQ in Microsoft .NET
Framework, Publisher: Microsoft Press 2010.
61
12. Introduction to LINQ Queries (C#), [Online]. Available
(http://msdn.microsoft.com/en-us/library/bb397906.aspx)
13. J. Mishra, and A. Mohanty, Software Engineering, Publisher: Pearson Education
India 2011.
14. M. L. Gillenson, Fundamentals of database management systems, Publisher: John
Wiley & Sons 2011.
15. qTip,[Online]. Available (http://craigsworks.com/projects/qtip/).
16. TortoiseSVN, [Online]. Available (http://tortoisesvn.net/)
17. M. Kawalerowicz, and C. Berntson, Continuous Integration, Publisher: Manning
Publications 2011.
18. Cruise Control.NET, [Online]. Available
(http://cruisecontrolnet.org/projects/ccnet/wiki/About).