University of ManchesterSchool of Computer Science

Project Report 2015

A Photograph Database

Author: Ersin Aktekin

Supervisor: Dr. Milan Mihajlovic

Word Count: 7511

Abstract

A Photograph Database

Author: Ersin Aktekin

The aim of this project is to develop a feature-rich and powerful photograph organisation soft-ware that provides functionality for retrieval of photographs using natural language queriesalong with temporal expression recognition. The approach of using natural language queriesalong with temporal expression recognition is to address the issues that arise when a photo-graph is intended to be retrieved from large groups of photographs stored.

This report provides detailed information on the challenges, development approaches and theachievements of this project.

Supervisor: Dr. Milan Mihajlovic

Word Count: 7511

Acknowledgements

I would like to thank my supervisor, Dr. Milan Mihajlovic for providing his guid-ance and supervision.

I would like to also thank my fiance Nazife Sultanoglu and my parents for theirconstant support and motivation during my degree and project.

1

Contents

1 Introduction 51.1 Project Overview . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51.2 Aim . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51.3 Existing Solutions and their problems . . . . . . . . . . . . . . . . . . . . . . 51.4 Challenges . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

1.4.1 Temporal Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . 61.4.2 Compatibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2 Design 72.1 Platform . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

2.1.1 Desktop platform . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72.1.2 Web platform . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72.1.3 Mobile platform . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2.2 Programming language . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82.2.1 PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82.2.2 JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82.2.3 HTML & CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2.3 Architecture . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92.3.1 Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

2.4 Data Storage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112.5 Security . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

3 Development 123.1 Methodology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123.2 Database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123.3 MVC Framework . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14

3.3.1 Bootstrap . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153.3.2 Autoloader . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153.3.3 Router . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153.3.4 Controller . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153.3.5 Model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163.3.6 View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173.3.7 Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

3.4 Registration and Login . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183.5 Adding Photographs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193.6 Visibility of Photographs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193.7 Photograph Sharing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193.8 Photograph Manipulation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

3.8.1 contrastImage Function . . . . . . . . . . . . . . . . . . . . . . . . . 203.8.2 sepiatoneimage Function . . . . . . . . . . . . . . . . . . . . . . . . . 203.8.3 charcoalimage Function . . . . . . . . . . . . . . . . . . . . . . . . . 203.8.4 cropimage Function . . . . . . . . . . . . . . . . . . . . . . . . . . . 213.8.5 rotateImage Function . . . . . . . . . . . . . . . . . . . . . . . . . . . 213.8.6 modulateImage Function . . . . . . . . . . . . . . . . . . . . . . . . . 21

2

3.8.7 resizeImage Function . . . . . . . . . . . . . . . . . . . . . . . . . . . 223.9 Creating Albums . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223.10 Searching . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

3.10.1 Photographs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233.10.2 Albums . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27

4 Testing and Evaluation 284.1 Unit Testing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 284.2 Compatibility Testing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294.3 Beta Testing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

5 Conclusion 315.1 Achievements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31

5.1.1 MVC . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 315.1.2 Photo retrieval using temporal expressions and synonyms . . . . . . . . 315.1.3 Photograph organisation . . . . . . . . . . . . . . . . . . . . . . . . . 32

5.2 Further Improvements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 345.2.1 MongoDb Implementation . . . . . . . . . . . . . . . . . . . . . . . . 345.2.2 Linking geographical information to queries . . . . . . . . . . . . . . . 34

5.3 Remarks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

Bibliography 35

3

List of Figures

2.1 Sequence diagram for repository pattern . . . . . . . . . . . . . . . . . . . . . 10

3.1 Database structure of photolides.com . . . . . . . . . . . . . . . . . . . . . . . 143.2 Lanczos sampling formula . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223.3 Dynamically generated temporal expression representation automata . . . . . . 24

4.1 Codeception test suite output . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

5.1 Showcase of search with synonyms and temporal expression recognition. . . . 315.2 Photograph adding page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 325.3 Users’ My Photos page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 325.4 Photograph selection while album creation. . . . . . . . . . . . . . . . . . . . 335.5 Album name and icon choosing step. . . . . . . . . . . . . . . . . . . . . . . . 33

4

Chapter 1

Introduction

1.1 Project Overview

Photolides is an image organisation and sharing software with integrated image manipulationand meta data processing capabilities. Furthermore, the search functionality supports syn-onyms for keywords and temporal expression recognition that are converted to time constraints.

1.2 Aim

The aim of this project is, to provide a better alternative to traditional albums and other imageorganisation methods such as storing them in directories. Furthermore, providing easy retrievalof photographs when they are needed is an important motivator of the project. The fact thattraditional albums and equivalent software list albums in chronological order means that, usersneed to go through photographs in order to find the one they are looking for. This methodis inefficient and time consuming. By using the metadata from photographs along with shortdescriptions and names, it is intended make the retrieval of photographs a trivial task, hencesaving users time and effort.

1.3 Existing Solutions and their problems

There are many image organisation software available for the users to use. The main existingsoftware solutions are Flickr, Facebook and Picasa. Features and shortcomings of the thesesolutions are discussed below.

1. Flickr is an image and video hosting service that allows users to share the media up-loaded. In addition to this, users can search for photographs on Flickr. Although Flickrprovides reliable and great service, it is mostly aimed at providing hosting services andlacks the rich functionality offered by other alternatives such as powerful image manip-ulation tools. [12]

2. Facebook is a social network platform that supports uploading, tagging and sharing ofphotographs. The main shortcoming of Facebook is that there is no photograph searchfunctionality offered to users. To find a photograph users need to go through all thephotographs to find the one they are looking for. [11]

3. Picasa is an image organisation software with an integrated web service to offer sharingfunctionality. Very advanced metadata processing and photo search features are imple-mented but the software lacks the accessibility that is offered by web applications suchas Flickr and Facebook. [14]

5

1.4 Challenges

Throughout this project there were challenges that had to be overcome in order to achieve thedesired functionality and produce good quality software. The challenges and their significanceto the project are explained in this section.

1.4.1 Temporal ExpressionsTemporal expressions are series of tokens that express a point or a period of time using wordsand numbers. For example, the sentence ”Family vacation in summer of 2010” denotes theperiod between 01/06/2010 and 31/08/2010. The challenge was to identify the temporal ex-pressions within search queries and parse them in order to obtain dates that can be used toperform database queries. Since the temporal expressions are in the form of natural language,the task of identifying and converting the temporal expressions to dates proved to be very chal-lenging.

To overcome this challenge a multi-step process was created. This process consists of dynam-ically creating a regular expression at run time using configuration data to match wide varietyof temporal expressions. Using this regular expression, the user’s search query is checked forpresence of temporal expression which is then extracted and parsed.

Since the retrieval of photographs is a significant part of the main functionality of the soft-ware, the challenge was crucially important to overcome.

1.4.2 CompatibilityAlthough HTML and CSS are industry standards for creating web pages, the interpretationvaries greatly between browsers. [29, 30] While some browsers implement cutting edge tech-nologies to provide functionality, some lack behind in certain areas, failing to fulfil the re-quirements of the page to be rendered successfully. [7] In addition to this, even though somefunctionality is implemented in all browsers, due to differences in implementation, given thesame code, browsers create different outputs. This results in unexpected behaviour and in somecases a bad user experience. As it would have taken great amounts of time and effort to achievecross-browser compatibility, to overcome this challenge a CSS framework called BootstrapCSSwas used which is designed to be compatible with most browsers.

6

Chapter 2

Design

In this chapter of the report, the design decisions, details of the decisions and the alternativesconsidered along with reasons of why the decisions were made are discussed.

2.1 Platform

The choice of platform for developing the project for, was one of the first decisions that was re-quired to be made in order to continue planning the project accordingly. Three platforms wereconsidered before making any decisions and the decision was made based on the advantagesand disadvantages of each platform. All considered platforms and their advantages/disadvan-tages are discussed below.

2.1.1 Desktop platform

Advantages:

• Less security issues when compared to other platforms.

• The software is always available on the installed machines.

Disadvantages:

• The photographs added by the user is only available on the machine they are stored in.

2.1.2 Web platform

Advantages:

• As long as users have access to world wide web the same instance of software is acces-sible.

• Users do not have to consider the impacts of storing photographs on their machines.

• The processing power of web servers are considerably better than conventional desktopand mobile devices. [26]

Disadvantages:

• Security and privacy issues.

• User experience is effected by network reliability.

7

2.1.3 Mobile platform

Advantages:

• Great accessibility.

Disadvantages:

• Storage space requirements to store photographs.

• Considerably less powerful devices. [24]

After considering all the platforms stated above, the web platform was chosen to implementthe software for since it had better advantages compared with other platforms.

2.2 Programming language

Following the decision of implementing the software on the web platform, the choice of pro-gramming language needed to be made.

2.2.1 PHPPHP is a server side programming language that is used to implement the back-end function-ality of the software. Before settling on using PHP, other server side programming languagessuch as ASP and Node.js were considered. Due to the widespread adoption of PHP in the webdevelopment industry, there are large number of resources available on PHP. Furthermore, PHPis proven to be very suitable for the nature of this project considering that other main softwaresolutions, Flickr and Facebook were written in PHP. [27, 13] The availability of resources alongwith its the proven suitability to the nature of the project led to the decision of using PHP forserver side programming.

2.2.2 JavaScriptJavaScript is a widely used programming language for front end implementation of web pages.Adobe Flash was considered as the alternative to using JavaScript but it is eliminated due toconsiderably less available resources being available caused by its popularity being decreasedover the years. [5] Throughout this project JavaScript is used to implement interactive elements,live form validations and Asynchronous JavaScript and XML (AJAX) requests to create aninteractive and dynamic user interface.

2.2.3 HTML & CSSHTML along with CSS are the industry standards for presentation of the user interface for webapplications. HTML was used as the means to deliver content to the end-user in a readableand user friendly manner. CSS was used to add means to perform styling in order to createpresentable and responsive web pages that provide a good user experience and accessibility forthe system. [29, 30]

8

2.3 Architecture

The software architecture used for this project is Model-View-Controller (MVC).This architec-ture was chosen as it provides separation of concerns, the view is separated from the businesslogic (Model) and the interactions between view and model are controlled by the controller.This results in better readability and easier maintenance for the code. [17]

There are many MVC frameworks written for PHP such as ZendFramework and CodeIgniter.The MVC frameworks such as the ones named above are created as general purpose MVCframeworks that can be adopted to many implementations. [10, 31] In order to create thisflexibility of adaptation, many functionality that would have never been used for the imple-mentation of this project would have been included consuming resources. In order to reducethe overhead that would have been created if an existing solution was used, for the purpose ofbetter grasping the principles behind MVC frameworks and to be in control of every aspect ofthe software created, the developer decided to implement his own MVC Framework in PHP.

2.3.1 PatternsSoftware design patterns are best practice solutions to commonly occurring design problems.To produce high quality software that is easy to maintain and improve, the software designpatterns could not be ignored. Throughout this project several software design patterns wereused and are discussed in this section.

1. AdapterAdapter pattern is the practice of creating wrapper classes which hide the differencesbetween code implementations. [18] For example, creating different database adaptersallows for changing the database solutions in use by the system without requiring alter-ations to the existing code. In such cases, creating a new database adapter implementingthe same interface as the old one allows seamless adaptation. The adapter pattern is usedto create MySQL database adapter for the project. The reason to implement the adapterinterface was to future proofing the code in order to allow usage of better suited and/ormore efficient database solutions that may be released in the future.

2. RepositoryRepository pattern is used to create an abstraction layer that allows the developer tocode without worrying about how an object is created. The structure of this pattern isas follows: an initiator code calls a function such as ’fetchById’ on the repository class.The repository then calls the relevant fetch method in the storage class and passes thereturned data to ’fromArray’ function within the mapper class. The ’fromArray’ functionthen creates a collection of entity objects from the data provided and returns it to therepository which returns the created object to the code which invoked the ’fetchById’function in the first place. The interactions and structure of this pattern is shown inFigure 2.1.

9

Figure 2.1: Sequence diagram for repository pattern

The reasons for using this pattern is based on the facts that it improves the possibility ofbeing able to use automation for testing and that it allows for easy integration of cachingeven after the software is created. [19]

3. FactoryThe factory pattern is creating classes whose sole purpose is to create instances of otherclasses. This patterns helps reduce code duplication and create an abstraction layer thathides the probable complexity of creating new objects. [20] In the context of this project,the mapper classes mentioned in the explanation of repository pattern are one of theexample uses of factory pattern.

4. SingletonIn some cases creating more than one instance of an object could confuse things and mayeven result in unexpected behaviour leading to hard to find and potentially critical bugs.[16] For instance, this project uses an authorisationManager class that checks if a visitoris logged in to the system or not. Creating two instances of this object can result for theuser to be treated as not logged in while using some parts of the system although he maybe accurately treated as a logged in user in the other parts. Cases such as this not onlycreate confusion but also provide bad experience to the user. To ensure that only oneinstance of a class is created, this pattern was used.

10

2.4 Data Storage

All systems that has states needs some way of data storage in order to save data which thencan be populated to the system on consecutive uses. For the purpose of this project MySQLdatabase was chosen to store non-binary data. The reason for this decision is the speed andscalability of MySQL databases making them very good choices for web implementations.[21]

In addition to MySQL database, MongoDb was considered to be used for storing binary data.The idea of using MongoDb was later dropped after consideration due to the complexity thatwould have been added to the overall structure of the system. Instead of using MongoDb thebinary data is chosen to be stored as files on the hard drive.

2.5 Security

Security is an important aspect for all software. Although patches are released for the tech-nologies and operating systems in use to fix security flaws one can never be sure if or when anew security flaw will be found that may compromise users’ data stored by the software.

One of the most common security flaws for web applications is SQL injection. [9] SQL in-jection is using SQL code within the data fields provided to manipulate the SQL queries toachieve behaviour intended by the attacker. This security flaw can be used to retrieve datastored in the database. To prevent SQL injection, the data provided by the user are, insteadof being directly used, bind to the SQL queries. The process of parameter binding, solves theissue of requiring to escaping special characters which can be used to perform SQL injection.

In the event of a database breach, the users’ data such as passwords stored in the database willfall in the hands of the attackers. In cases where a user uses the same password for any of theiraccounts for other services, user’s other accounts may also be compromised. To further protectthe users, passwords are hashed with salt values before being stored in the database makingthem almost impossible to be reversed into plain text format, keeping the users’ passwords safein cases of database breaches.

11

Chapter 3

Development

3.1 Methodology

Throughout the development of this project, the agile software development methodology wasused. Although some agile practices were not suitable due to the nature of the project such asprogramming in pairs, the practices that could be applied were used. An iterative approach wastaken for the development of the features. Each iteration was assigned manageable numberof features as tasks and at the end of each iteration which lasted 3 weeks, the process of theiteration was reviewed. In addition to practices of Iterative Development and Frequent review ofperformance as described in the previous paragraph, the practices of Test-Driven Developmentand Short code-commit-build cycle were also applied during the development process. [3, 2, 1,4]

3.2 Database

To implement connection to MySQL database in PHP, mysqli extension is used. To use themysqli class a new instance is created with host, username, password and database name pa-rameters. If the connection gets created successfully a connection object is returned, in the caseof failure to connect an error number and message is returned. Below is how the connectionusing the mysqli class is made along with how the errors are handled.

12

Along with the mysqli class mysqli stmt class is used to prepare SQL statements by bindingvalues to SQL queries in order to remove the necessity to escape values to provide better secu-rity. The example of how this is done can be found below.

13

Figure 3.1 below shows the structure of the database created for the project. The databasestructure for the project consists of four tables with relations. As the names of the tablessuggest, users, profiles, albums, photos tables, store data for users, user profiles, albums andphotographs respectively. In addition to this database, a lexical English database - WordNetdatabase, is also imported and used for finding synonyms for words. [23]

Figure 3.1: Database structure of photolides.com

3.3 MVC Framework

The MVC framework is rather complex and consists of several important files and classescreated in order to achieve its functionality. This section explains how the implementationswere done and what each ones function in the system is.To be able to control each interaction with the system, all requests send to the server are directedto a single point of entry. The single point of entry to the system is the index.php file that residesin the publicly accessible public directory. The rest of the files are located in application,includes and library directories that are not publicly accessible. In addition to single pointof entry, this hierarchy adds another layer of security, preventing the source code from beingpublicly accessible.

14

3.3.1 BootstrapBootstrapping is the process of initialising a system before any functionality is being provided.This process ensures that necessary libraries and services are loaded before the system is used.The single point of entry, index.php file, includes (effectively dynamically copies and pastesthe contents of the included file - will be mentioned as loads in the rest of the report) includes/-bootstrap.php. The bootstrap.php file checks if a session is present and if not creates a newsession. Defines a constant that contains an absolute path to the current root directory of thesystem. Following the creation of the constant, config.php which contains the configurationparameters, autoloader.php which registers an autoloader function and shared.php which con-tains the code to run the system in development mode with all error and warning types enabledare loaded by the bootstrap file. Once all the files are loaded a new instance of Router class iscreated and dispatch function of the object is called to handle the request.

3.3.2 AutoloaderAutoloading is dynamically including the class files in order to remove the need to includingthe files in the code using their absolute or relevant paths. For autoloading to work the psr-0standard of naming and namespacing is used as set by the PHP Framework Interop Group. Forregistering the autoloader function in PHP, the native spl autoload register function is calledwith the autoloader function as a parameter. [22] The autoloader function created for thisproject works as the pseudo code below suggests.

3.3.3 RouterThe Router class consists of a public construct, dispatch and a private parseRoute functionsalong with relevant getter and setter methods for the protected variables. Once an instance ofRouter class is created with correct parameters the dispatch function is needed to be called.

The dispatch function calls the parseRoute function which parses the route accessed andidentifies the controller, model and action that is required. After the required controller andmodel is identified, an instance of the required controller is created passing the model name re-quired as a parameter along with configuration and action parameters. In the case of requestedaction method not existing, the action determined by the parse function is regarded as a pa-rameter value instead of an action. The relevant action function in the controller is called withparsed parameters and the returned data of this function is displayed to the user.

3.3.4 ControllerAlthough there are many controllers, the actual controllers only contain action functions thatdetermine what needs to be done in specific scenarios and all controllers extend MVC/Con-

15

troller.php class. This class contains construct, setVariable, redirectToAction, unknownAc-tion, prepareView, getter and setter functions.

construct Function

This constructor function, once called, sets the configuration values, creates an instance of Ser-viceLocator, ViewTemplate and relevant model classes then saves these instances as protectedclass variables.

setVariable Function

The setVariable function requires a variable name and value which are used to set the value ofa variable in the view template. This functionality is necessary to avoid using global variableswhich are usually accepted as bad practice.

redirectToAction Function

This function requires an action name provided as a parameter and accepts a controller nameand parameters for the action function as optional parameters. As its name suggests, this func-tion provides the functionality to call an action in the same controller or another with or withoutparameters.

unknownAction Function

This function handles the event of the users trying to access a view that does not exist. Oncecalled sets the response header to a HTTP 404 not found header and displays the configured404 page.

prepareView Function

Using the controller and action names set, the path to relevant partial html (phtml) file to beused by the created ViewTemplate instance is constructed. If the path points to a file, the pathis set in the ViewTemplate instance. In the case of phtml file not existing the unknownActionfunction is called.

3.3.5 ModelJust like controllers there are many, functionality specific models that contain the functionshandling the business logic and all models extend the MVC/Model class. This class containspublic construct and private init functions along with getter and setter methods. The con-structor function sets the service locator instance passed and reference to the model class itselfas values of relevant protected class variables. Before the execution of this function is com-plete, the init function is called. The init function is a placeholder function that is intended tobe overridden if necessary, by the model classes extending the MVC/Model class.

16

3.3.6 ViewThe ViewTemplate class contains construct, renderBody, renderSection, render, toString,setVariable functions as well as getter and setter methods for the protected class variables.

The construct function is to create a new instance of the class and sets values passed asparameters as their relevant class variables’ values. renderBody outputs the contents of thebody section of the template. Similarly, renderSection function outputs the contents of the sec-tion determined by the section name passed as a parameter to the function.The render function provides the main functionality for the class. This function works by sav-ing the rendered contents of the phtml file to a class variable. Depending on the request typeand configuration data, determines if the data requires to be output without the layout template;which contains the header and the footer. If the layout template is to be dismissed, then thedata is displayed to the user. In the case where the layout template is to be displayed, the layouttemplate is rendered.

3.3.7 ModulesThe module classes are created as additional helper classes that help save time and effort byreducing code duplication.

Dependency Injector

Although coupling is intended to be kept to minimum, in complex systems such as this projectit is inevitable to have some coupling. The dependencies of classes such as the Repository classdepending on Storage and Mapper classes means that every time an instance of the class is tobe created, instances of Storage and Mapper classes needs to be created. The Storage class de-pending on a database adapter means that for creating an instance of Repository class, instancesof three other classes needs to be created. When done in a larger scale, for multiple classes inmultiple places, this results in large amounts of time being spend and code being duplicated.The dependency injector (Di) class, based on the configuration creates all the instances solvingthe problem of having to create dependency classes’ instances.

The Di class when asked for an instance of a class, checks the dependencies of the instancerequested and creates instance of each dependency the class has. Once instances of all thedependency classes are created the instance of requested class gets created and returned by thefunction.

Service Locator

ServiceLocator class is passed as a parameter on creation of new instances to relevant classesmaking modules accessible in all classes and ensuring that only one instance of each module iscreated. The class constructor takes in configuration data, creates instances of: MySqlAdapter,Di and AuthManager classes which are then stored in protected class variables.

Authorisation Manager

Authorisation manager checks for presence of session variable that indicates user is logged in.If found the value stored in the session variable - a user id; is used to fetch the user entity object

17

and the object is stored in a protected class variable. The user’s login state is also stored in aprotected class variable. Both these values are retrieved from the instance in various places andused.

3.4 Registration and Login

For both registration and login features, input validation is implemented to validate the formatof the values provided. To achieve this validation, the values provided by the user is checkedusing regular expressions. For example, the code snippet below shows how the usernameprovided while registration is checked to ensure it is not empty and that it only contains lettersand numbers. The length of the provided username is also checked to be in the range of four toten characters. The validations are in place to prevent vulnerabilities mentioned in Section 2.5.

After the input data is validated and it passes validation, before continuing the process of loginor registration, the password is hashed using the native PHP function password hash. As ofPHP 5.5.0, the version that the software is developed towards for, this function by default, usesbcrypt hashing algorithm along with an automatically generated salt value to protect againstrainbow table attacks. The returned value contains the hashed password, cost and salt used bythe hash function.

Since the hashed password stored in the database is irreversible to its plain text form, in thecase of login, the password provided by the user needs to be send to native password verifyfunction along with hashed value as parameters. This function hashes the password with theinitial cost and salt values and compares the hashed passwords to confirm their match. For theimplementation in this project, all user entries from the database is retrieved and the passwordcheck along with username checks are performed as below.

18

3.5 Adding Photographs

The photograph adding functionality starts with users choosing local files on their devicesand uploading them to the web server through the provided user interface. The upload pro-cess is then checked for successful completion followed by the validation of the size and for-mat of the uploaded file. Once the image file is validated, a unique name, in the form ofuserID RandomString.fileExtention is generated and the uploaded file is moved from the tem-porary upload directory to the uploads directory. The generated RandomString consists of 15randomly chosen letters and number to ensure uniqueness and make it impossible for otherusers to guess as a security measure.

Once the uploaded file is moved to uploads directory with the generated unique name, aninstance of Imagick PHP extension class is created by passing pointer to the file as a parameter.Depending on the dimensions of the image file, if necessary the image is resized keeping theaspect ratio. In addition to resizing, a thumbnail for the image is created, again keeping theaspect ratio.

The resizing and thumbnail creation is followed by reading of exif metadata from the imagefile if present. The date image is taken and the GPS data is saved in the photographs entityinstance created from the extracted exif data array obtained using the exif read data functionprovided by PHP. The created Photo entity object is then saved to the database.

3.6 Visibility of Photographs

In order to achieve this functionality, the visibility of photographs are stored in the photographstable in the database and is used to permit or prevent other users from searching for and access-ing photographs.

3.7 Photograph Sharing

A unique sharing link consisting of letters and numbers which is ten characters long is gener-ated. The generated sharing link consists of the link to the photograph with the unique sharingid concatenated to it by an exclamation mark and looks like http://www.photolides.com/view/photo/9-ir47uvvrvp7zlb6.jpg!qtgbb9q7am. When a user enables sharing of a photograph bylink, the generated sharing link is stored in the database and once the link is visited, the linkprovided for the image is checked against the database to confirm its validity and the user isallowed to view the photograph if the link is valid even if the photograph was set as a privatephotograph.

3.8 Photograph Manipulation

For manipulation of the photographs a PHP extension called Imagick which wraps the Im-ageMagick software functionality is used. In this section details of how the functionality pro-vided by Imagick extension is used to implement features along with details of how some ofthe ImageMagick functionality is technically achieved is explained. The reason for choosing

19

ImageMagick software instead of implementing each functionality from scratch was the pow-erful features offered by this software along with the fact that, instead of trying to implementfunctionality that is already easily available to be integrated, spending more effort on the func-tionality that are crucial to this project such as temporal expression recognition was prioritised.[15] This section is organised by grouping the functionality used from the Imagick extensioninstead of the features provided by this project.

For all the functions explained below to work, an instance of the Imagick class was createdpassing the full image name including its path as illustrated by the code snippet below.

3.8.1 contrastImage FunctionThis function takes in a single parameter that can have a boolean value or the integer values ofeither ’0’ or ’1’ that are regarded as boolean values.

Setting the constrastAdjust variable to TRUE; has the effect of increasing the contrast level ofthe image by 1 and setting the value of the variable to FALSE has the effect of decreasing thecontrast level by 1. In order to achieve the functionality offered by the user interface -usinga slider to adjust the contrast level; the call to the contrastImage function is wrapped in a forloop to apply the effect the number of times set by the user.

3.8.2 sepiatoneimage FunctionThis function provides a sepia tone effect that is similar to ones obtained in the process ofdeveloping an image in a darkroom.

This function is invoked with a floating point number that defines the threshold level requiredfor the sepia tone effect.

3.8.3 charcoalimage Functioncharcoalimage function is used as shown below in order to achieve an effect similar to charcoaldrawing of the image.

The two parameters, first being the radius and the second being the standard deviation of theGaussian are required for this function.

20

3.8.4 cropimage FunctionAs its name suggests this function is used for cropping images. In order to achieve the desiredcropping four parameters are required while invoking this method which is done as shownbelow.

The first two parameters are the desired new width and height values, the following two param-eters are the X and Y coordinates of the pixel to start cropping from. Given these parameters,this function crops a portion of the image by the desired height and width starting from the Xand Y coordinates.

3.8.5 rotateImage FunctionTaking in two parameters, background and degrees, this function rotates the image by thedegree and fills in the empty spaces with the colour provided as the background parameter.

The code snippet above creates a new ImagickPixel object passing the hexadecimal value ofcolour white and is provided as the background colour. The degrees variable is set to 90 or -90to achieve the functionality of rotating an image to left or right.

3.8.6 modulateImage FunctionThe modulateImage function takes in three floating point numbers as parameters. The firstparameter is used for brightness, second one for the saturation and the third one for hue. Pro-viding the value of 100 to any of the parameters causes that value to be kept same as the originalone. The usage of this function for this project is shown below.

In addition to being used for providing the functionality for changing brightness, hue and sat-uration; this function is also used for converting images to grayscale. This functionality isachieved by keeping the brightness and hue values as the original ones and setting the satura-tion value to zero. The example of usage is as follows:

21

3.8.7 resizeImage FunctionContrary to what many may think the resizing functionality is not as simple as providing newheight and width values for images to be resized to. This function takes in 4 mandatory and 1optional parameter in order to work.The first two parameters for this function are the required width and height values respectively.The third parameter is the filter name that is to be used for the resampling of the image. Thefourth parameter is the blur parameter, which when set to a value greater than 1 results in ablurry and when set to a value less than 1 results in a sharp image. The final, optional parameteris the best fit parameter that, when set to TRUE preserves the aspect ratio of the original imageand disregards it when set to FALSE. The code snippet below shows how the above explainedfunction is used in this project.

As it an be seen from the code snippet above, the blur parameter is set to zero in order toachieve very slight sharpening of the resized image to improve its quality. The resamplingfunction chosen is LANCZOS. This resampling function is a windowed (modulated) version ofthe sinc function that uses 3 lobes and is formulated as shown in Figure 3.2 below where a =(number of lobes + 1)/2. [28, 25]

Figure 3.2: Lanczos sampling formula [28].

3.9 Creating Albums

The album creation functionality consists of selecting photographs to be added, selecting aname and an icon for the album. The ids of photographs selected gets serialised using nativePHP serialize function and the album data is stored in the database.

22

3.10 Searching

There are two types of search functionality offered by this project, photograph and albumsearching. In this section the implementation of search functionality is explained.

3.10.1 PhotographsThe users have the functionality to be able to search for either public or private photographs.The public search functionality searches through all the photographs that have their visibil-ity set to public whether they belong to the logged in user or not. As opposed to the publicsearch functionality, the private search functionality allow the users to only search through thephotographs that belong to them. Although the results of the two search functions vary, theirimplementation is almost identical, the only difference being the visibility constraint in theSQL query set to the value representing public or private.

The search query entered by the user is first converted into array of words discarding anyspecial characters. This is done by using the native preg match all function. Although thisfunction is intended to perform regular expression matching, when given an array as the thirdparameter, turns the array into a multi-dimensional array containing matches. The first ele-ment of the resulting array is an array containing the matches. Below is the code snippet thatachieves the above explained functionality.

Following the extraction of the keywords into an array, a regular expression to match the tempo-ral expressions is dynamically generated using the configuration data. The regular expressiontargets specific words in order to match temporal expressions. A simplified finite state automataof the generated regular expression is shown in Figure 3.3. Below are the explanations to betterunderstand Figure 3.3, necessary due to its simplification.

• dayName - any day of the week.

• writtenNo - a representation of a number from 1 to 50 in writing.

• monthName - a name of one of the twelve months.

• seasonName - a name of one of the four seasons.

• holidayName - either ’christmas’ or ’easter’.

• MODULE - substitute used for the repeating part of the regular expression marked as’Group 20’ in the figure.

23

Figure 3.3: Dynamically generated temporal expression representation automata. This figureshows a simplified version of the regular expression.

24

Once the regular expression for matching temporal expressions is created, the getTemporal-Expression function is invoked passing the regular expression as a parameter together with theoriginal search query. The original search query is then matched against the regular expression,if present, extracting the temporal expression as an array of words from the query. This proce-dure is the same as the process shown by the code snippet above except the regular expressionpassed to preg match all function is the generated regular expression for matching the tempo-ral expressions. The step following the extraction of regular expression into an array is parsingthe extracted regular expression in order to get the time constraints to be used in the SQLquery. For this step, the getTimeConstraintFromTemporalExpression function is called passingconfiguration data along with the array containing temporal expression as words, which willfrom now on be referred to as temporalExpression Array. This function, converts the elementsof temporalExpression Array to lower case and using the same regular expression as the codesnippet above removes the special characters from its elements followed by removal of unnec-essary stop words from the array. The unnecessary stop words that play no vital role in theidentification and parsing of the temporal expression are found to be ’the’, ’a’ and ’of’ words.Using keywords unique to each temporal expression, such as ’on’ and ’beginning’, the formatof the temporal expression is identified and the temporal expression is converted into a timeconstraint. An example of how this is done using the ’on’ keyword is shown below.

25

When the time constraints are created from the temporal expression, the temporal expres-sion is removed from the search query entered by the user and synonyms for the remainingkeywords are retrieved from the Wordnet dictionary database. The obtained synonyms andkeywords are then searched in the database using MySQL Full-Text Search(FTS) along withthe time constraints obtained from parsing the temporal expression. As shown by the codesnippet below, the keywords are converted to a string separated by the space character and usedto search for matching name or description fields using FTS in boolean mode. The SQL queryalso takes into account the time constraints and in the case of no time constraints the resultsof the query are ordered by the relativity score calculated by FTS function. It is chosen to runFTS in boolean mode in order to disable the 50% threshold enforced in natural language mode.When run in natural language mode, FTS disregards the keywords appearing in more than 50%of the entries in the database. Below is the code snippet that is used to query the database.

26

In the case of no results being obtained using the time constraints, the time constraints aredisregarded and the same query is run again without the time constraints and the keywordsremoved as part of the temporal expression kept intact. If time constraints are disregarded, theuser is informed about the adjustment to the query when the results are displayed.

3.10.2 AlbumsThe album search functionality consists of finding synonyms for the keywords and searchingusing FTS in BOOLEAN MODE against the name field in the albums table. This processis almost identical to the process explained for searching photographs except the parts abouttemporal expressions are not applicable since the time constraints are irrelevant to the albums.

27

Chapter 4

Testing and Evaluation

4.1 Unit Testing

Unit testing is the method of automated testing by which individual classes(units) are testedwith pre-determined test data. By using unit testing, bugs in the code can be discovered in theearly stages of development.

The library code written for this project was unit tested using Codeception testing framework.Codeception is a testing framework based on PHPUnit that builds on top of the PHPUnit func-tionality by providing more functionality such as class mocking support and flexibility. [8]

The approach to unit testing taken was, Test-Driven Development (TDD). The approach sug-gests writing tests before writing the code providing a black-box testing environment and re-sults of the tests driving the development process. The advantage of TDD approach is the factthat it eliminates any potential bias the developers may have while writing the tests or test data.[4]

The process of unit testing classes in this project was divided into three steps. First, test datathat tests a good range of possible issues were written followed by the actual unit test for theclass. After the test data and unit tests were written, the actual class implementation was writ-ten and the tests were ran for the class. This last step was repeated until the code producedpassed all tests.

Below is an example of test data and unit test written in Codeception to test creating userentity objects.

Test data:

28

Test function:

In total 100 tests were written for the library code that contain 205 assertions to ensure that theproduced code works as intended and provides the expected output.

Figure 4.1: Codeception test suite output. This screen shot shows the resulting output of run-ning the whole test suite on the library code.

4.2 Compatibility Testing

As stated earlier in the Challenges section of the first chapter of this report, compatibility for allbrowsers is an important and challenging aspect for web applications. Although a CSS frame-work designed for compatibility and mobility in mind was used for development of the project,the created pages still needed to be tested to ensure cross-browser compatibility. Compatibility

29

testing is done by reviewing the renderings of web pages in different browsers and differentoperating systems.

An ideal scenario is having access to different operating systems and different browsers toreview pages, in the meantime testing functionality as well. This scenario is very time consum-ing and requires access to different operating systems and hardware.

To solve this problem, a service that provides screen shots of the pages rendered using differentbrowsers called Browsershots (browsershots.org) was used to get renderings of the pages ondifferent operating systems and browsers. [6] In addition to use of Browsershots, the GoogleChrome browser’s developer console was also used to test the compatibility of pages on differ-ent screen resolutions making sure that pages on mobile devices were rendered as intended.

4.3 Beta Testing

Beta testing is the testing phase where selected, small group of users test the software with theintention to identify problems and providing feedback. This testing phase helps identify bugsand design concerns before the release of the software to improve its quality.

Beta testing for this project was done by the family and friends of the developer, a total of17 beta testers. The beta testers used the software and provided feedback on the functional-ity and if the desired outcomes were achieved when it was used. The feedback provided wasregularly reviewed and adjustments and bug fixes were produced for the software.

30

Chapter 5

Conclusion

5.1 Achievements

In this section the significant achievements on completion of this project are explained andillustrated using figures where appropriate.

5.1.1 MVCA secure and easily maintainable MVC framework was created for the project which helpssupport and serve the functionality offered by the project library.

5.1.2 Photo retrieval using temporal expressions and synonymsTools providing functionality of searching for photographs using keywords, their synonymsand temporal expressions in the search query were successfully created. Figure 5.1 shows anexample use case for the scenario.

Figure 5.1: Showcase of search with synonyms and temporal expression recognition.

31

5.1.3 Photograph organisation

Upload

The functionality of storing and organising photographs is achieved. The photograph addingpage and the page showing photographs of the user in descending order of date they are addedto the system are shown in Figure 5.2 and Figure 5.3 respectively.

Figure 5.2: Photograph adding page.

Figure 5.3: Users’ My Photos page.

32

Albums

Functionality of traditional photograph albums is achieved where users can create new albumsand store photographs in the albums created.

Figure 5.4 shows the process of choosing photographs while creating albums.

Figure 5.4: Photograph selection while album creation.

Figure 5.5 shows the page where created albums are displayed in order of the dates they arecreated.

Figure 5.5: Album name and icon choosing step.

33

5.2 Further Improvements

This section discusses possible improvements to the project in future to improve its functional-ity and provide better user experience.

5.2.1 MongoDb ImplementationFunctionality for accessing and storing data to a MongoDb database can be implemented. Hav-ing this functionality available, MongoDb can be used for storing binary data, namely the pho-tographs uploaded by the users in order to provide better security and privacy. By storingthe photographs in MongoDb database, hence adding another layer of security, process of ac-cessing the photographs can be further protected from unauthorised access due to passwordprotected access to the database.

5.2.2 Linking geographical information to queriesJust like temporal expressions are extracted from search queries, the location information canbe extracted and parsed. This then will allow searching for photographs using GPS data embed-ded in the photographs in the form of exif metadata. This feature if implemented can improvethe results of searching significantly by retrieving more relevant photographs.

5.3 Remarks

The final software created, Photolides.com, provides an alternative to traditional photographorganisation solutions and similar, in most cases more advance querying tools for retrieval ofphotographs. The created software serves a great purpose and is ready to be used by manyusers.

Hopefully the software will get used, providing easy to use and powerful photo organisationtools for the users to solve the issue of organising the large amounts of photographs people tendto have with the improvements in today’s technology.

34

Bibliography

[1] Agile Alliance and Institut Agile. Heartbeat Retrospective. [Online]. Available from:http://guide.agilealliance.org/guide/heartbeatretro.html. [Accessed 27thApril 2015].

[2] Agile Alliance and Institut Agile. Iterative Development. [Online]. Available from: http://guide.agilealliance.org/guide/iterative.html. [Accessed 27th April 2015].

[3] Agile Alliance and Institut Agile. Pair Programming. [Online]. Available from: http://guide.agilealliance.org/guide/pairing.html. [Accessed 28th April 2015].

[4] Agile Alliance and Institut Agile. Tdd. [Online]. Available from: http://guide.agilealliance.org/guide/tdd.html. [Accessed 28th April 2015].

[5] Arora N. Adobe’s Flash Surrender Proves Steve Jobs And Ap-ple Were Right All Along With HTML5. [Online]. Available from:http://www.forbes.com/sites/greatspeculations/2011/11/09/adobes-flash-surrender-proves-steve-jobs-and-apple-were-right-all-/along-with-html5/. [Accessed 26th April 2015].

[6] Browsershots.org. What is Browsershots? [Online]. Available from: http://browsershots.org/. [Accessed 27th April 2015].

[7] Can I Use. Browser Feature Support Chart. [Online]. Available from:http://caniuse.com/#compare=ie+11,firefox+37,chrome+42,safari+8,opera+27,ios_saf+8.1-8.3,android+40,op_mob+24,and_chr+42,and_ff+37.[Accessed 26th April 2015].

[8] Codeception. Modern PHP testing for everyone. [Online]. Available from: http://codeception.com/. [Accessed 26th April 2015].

[9] Curtis S. Barclays: 97 percent of data breaches still due to SQL injec-tion. [Online]. Available from: http://www.techworld.com/news/security/barclays-97-percent-of-data-breaches-still-due-sql-injection-3331283/.[Accessed 27th April 2015].

[10] EllisLab. A Brief History of CodeIgniter. [Online]. Available from: https://ellislab.com/codeigniter. [Accessed 26th April 2015].

[11] Facebook. About Facebook. [Online]. Available from: https://www.facebook.com/facebook/info?tab=page_info. [Accessed 24th April 2015].

[12] Flickr. About Flickr. [Online]. Available from: https://www.flickr.com/about. [Ac-cessed 27th April 2015].

[13] Flickr. HSoftware Engineer - Product. [Online]. Available from: https://www.flickr.com/jobs/software_engineer_product/. [Accessed 26th April 2015].

35

[14] Google. Welcome to Picasa & Picasa Web Albums. [Online]. Available from: https://support.google.com/picasa/answer/157000?hl=en-GB. [Accessed 25th April2015].

[15] ImageMagick. Features and Capabilities. [Online]. Available from: http://www.imagemagick.org/. [Accessed 26th April 2015].

[16] Microsoft. Exploring the Singleton Design Pattern. [Online]. Available from: https://msdn.microsoft.com/en-us/library/ee817670.aspx. [Accessed 26th April 2015].

[17] Microsoft. Model-View-Controller. [Online]. Available from: https://msdn.microsoft.com/en-us/library/ff649643.aspx. [Accessed 26th April 2015].

[18] Microsoft. Structural Patterns: Adapter and Faade. [Online]. Available from: https://msdn.microsoft.com/en-us/library/orm-9780596527730-01-04.aspx. [Ac-cessed 26th April 2015].

[19] Microsoft. The Repository Pattern. [Online]. Available from: https://msdn.microsoft.com/en-us/library/ff649690.aspx. [Accessed 26th April 2015].

[20] Object Oriented Design. Factory Pattern. [Online]. Available from: http://www.oodesign.com/factory-pattern.html. [Accessed 26th April 2015].

[21] Oracle. DBA and Developer Guide to MySQL 5.6. [Online]. Available from: http://dev.mysql.com/tech-resources/articles/mysql-5.6.html. [Accessed 26th April2015].

[22] PHP Framework Interop Group. Autoloading Standard. [Online]. Available from: http://www.php-fig.org/psr/psr-0/. [Accessed 25th April 2015].

[23] Princeton University. What is WordNet? [Online]. Available from: http://wordnet.princeton.edu/. [Accessed 25th April 2015].

[24] Sauter M. Comparing CPU Power Between Smartphonesand Notebooks with SunSpider. [Online]. Available from:http://mobilesociety.typepad.com/mobile_life/2012/11/comparing-cpu-power-between-smartphones-and-notebooks-with-sunspider.html. [Accessed 26th April 2015].

[25] Thyssen A. ImageMagick v6 Examples – Resampling Filters. [Online]. Availablefrom: http://www.imagemagick.org/Usage/filter/\#window\_how. [Accessed26th April 2015].

[26] Unixy.net. The Difference Between a Server and Desktop CPU.[Online]. Available from: http://blog.unixy.net/2009/12/the-difference-between-a-server-and-desktop-cpu/. [Accessed 26th April2015].

[27] Verlaguet J and Menghrajani A. Hack: a new programming language for HHVM.[Online]. Available from: https://code.facebook.com/posts/264544830379293/hack-a-new-programming-language-for-hhvm/. [Accessed 26th April 2015].

36

[28] Wikipedia. Lanczos resampling. [Online]. Available from: http://en.wikipedia.org/wiki/Lanczos_resampling. [Accessed 26th April 2015].

[29] World Wide Web Consortium. Cascading Style Sheets home page. [Online]. Availablefrom: http://www.w3.org/Style/CSS/Overview.en.html. [Accessed 26th April2015].

[30] World Wide Web Consortium. HTML, The Webs Core Language. [Online]. Availablefrom: http://www.w3.org/html/. [Accessed 26th April 2015].

[31] Zend Technologies. About. [Online]. Available from: http://framework.zend.com/about/. [Accessed 26th April 2015].

37