Code Generation for the SATIN Platform: Migrating SATIN Applications Into Native Environments

(1)

MASTER'S THESIS

Code Generation for the SATIN Platform

Migrating SATIN Applications Into Native Environments

Manuel Cerrillo Bermejo 2014

Master of Science (120 credits) Computer Science and Engineering

Luleå University of Technology

Department of Computer Science, Electrial and Space Engineering

(2)

MASTER THESIS

Code generation for the SATIN platform

Migrating SATIN applications into native environments

Manuel Cerrillo Bermejo

(3)

1 | L u l e å T e k n i s k a U n i v e r s i t e t

(4)

CODE GENERATION FOR THE SATIN PLATFORM,

Migrating SATIN applications into native environments Manuel Cerrillo Bermejo

Computer Science, Electrical and Space Engineering Luleå University of Technology

(5)

Printed by Universitetstryckeriet, Luleå 2014 Luleå 2014

(6)

R E S U M E N

Autor: Manuel Cerrillo Bermejo

Título: Generación de código para la plataforma SATIN: migrando las aplicaiones de SATIN a entornos nativos

Tutores: Kåre Synnes y Jan-Olov Johansson Institución: Luleå University of Technology Lugar: Luleå, Suecia

Fecha de lectura: 02/06/2014

El proyecto que a continuación se presenta tiene como objetivo migrar las aplicaciones web generadas por la plataforma SATIN a entornos nativos, en concreto a los sistemas operativos iOS y Android para dispositivos móviles. A su vez, comprende la investigación acerca de las herramientas disponibles para realizar esta tarea y establecer una comparación entre la herramienta seleccionada (Apache Cordova) y la herramienta seleccionada por Daniel Buldón Blanco (Titanium Appcelerator) en la realización de su proyecto.

SATIN es un proyecto desarrollado por la universidad de Luleå (Luleå University of Technology) en colaboración con la empresa CodeMill. Dicho proyecto consiste en una plataforma web que permite el desarrollo de servicios móviles a personas sin conocimientos de programación.

La plataforma presenta una interfaz sencilla en la cual los usuarios pueden crear aplicaciones de forma gráfica, simplemente seleccionando los componentes que quieren usar en su aplicación y uniéndolos entre sí.

Las aplicaciones generadas actualmente por la plataforma SATIN son aplicaciones web, es decir, se trata de páginas web programadas en JavaScript, HTML y CSS que el usuario final puede utilizar en su dispositivo móvil a través de un navegador web.

El objetivo de este proyecto abarca la migración de dichas aplicaciones web en aplicaciones nativas para iOS y Android de forma automática, consiguiendo así las ventajas que aporta una aplicación nativa frente a una aplicación web, como por ejemplo:

 Las aplicaciones nativas son más eficientes sobre dispositivos móviles puesto que se ejecutan directamente sobre el sistema operativo en cuestión y no a través un navegador web. Además, estas aplicaciones tienen acceso completo a las APIs nativas del dispositivo.

(7)

 Las aplicaciones nativas son más fáciles de comercializar que las aplicaciones web, puesto que pueden ser vendidas directamente a través de las plataformas específicas para cada sistema operativo como Google Play en el caso de Android o App Store en el caso de iOS.

El software desarrollado durante este proyecto se denominaWeb2Native y está escrito en el lenguaje de programación Java.

El principal motivo por el cual he elegido Java es la facilidad para crear un software multiplataforma. Con este lenguaje es sencillo crear un software que funcione correctamente sobre diferentes sistemas operativos sin modificaciones, permitiendo que el programa

Web2Nativefuncione correctamente sobre los sistemas operativos Windows, Linux y Mac OS.

La herramienta fundamental usada durante este proyecto es el software Apache Cordova. Este software, desarrollado y mantenido por la Fundación Apache, es open-source y su uso es gratuito.

La funcionalidad que aporta este software es la posibilidad de crear aplicaciones multiplataforma programando únicamente con tecnologías web, es decir, JavaScript, HTML y CSS.

Por otra parte, las herramientas usadas durante el proceso de firma de las aplicaciones Android son Keytool, Jarsigner y Zipalign, incluídas las dos primeras en el Kit de Desarrollo de Java (JDK) y la última en el Kit de Desarrollo de Software de Android (Android SDK).

Los requisitos previos necesarios para que el software desarrollado funcione correctamente son los siguientes:

 Versión 1.7 o superior del Kit de Desarrollo de Java (JDK)

 Apache Ant

 Kit de Desarrollo de Software de Android (Android SDK)

 Kit de Desarrollo de Software de iOS (iOS SDK), disponible exclusivamente para sistemas operativos MAC a través del programa Xcode.

 Apache Cordova

El software desarrollado se compone de tres clases java y una librería externa cuya funcionalidad se explica a continuación:

 Console.java: La funcionalidad básica de esta clase es emular terminales que sean válidos para diferentes sistemas operativos. En concreto, emula dos tipos diferentes de terminal; uno para sistemas operativos Windows y otro para sistemas operativos con núcleo de Linux.

(8)

 WebParser.java: Esta clase Java se encarga de descargar la aplicación web de SATIN que va a ser migrada a una aplicacíon nativa utilizando la librería externa Jsoup. Para ello, se descarga en primer lugar el archivo principal de la aplicaciónindex.html y a continuación todos los recursos apuntados por este archivo. Una vez que todos los recursos están almacenados adecuadamente, siguiendo la estructura de ficheros proporcionada por Apache Cordova al crear un nuevo proyecto, modifica el archivo

index.htmlpara que apunte adecuadamente a los recursos locales.

 Web2App.java: Esta es la clase principal del programa. En primer lugar, se encarga de comprobar que todos los argumentos introducidos por el usuario son correctos y ofrece ayuda en caso de que no lo sean. A continuación, utiliza la funcionalidad de las dos clases descritas anteriormente para dirigir el proceso de migración de la aplicación web a una aplicación nativa, así como el proceso de firma de las aplicaciones Android resultado de la migración.

Por último, el softwareWeb2Native.jar es muy sencillo de usar, cumpliendo con uno de los objetivos perseguidos desde el inicio del proyecto, a fin de facilitar la integración de este software en el servidor de la plataforma SATIN.

Para usarlo, es necesario ejecutarlo a través de una consola del sistema operativo y pasarle los siguientes argumentos:

 URL de la aplicación SATIN que va a ser migrada

 Plataforma destino

 Nombre seleccionado para la aplicación nativa

En caso de que el software se ejecute sobre un sistema operativo MAC para producir una aplicación Android, es necesario indicarle además la ruta hasta las carpetas^toolsy^platform-

toolsdentro del SDK de Android.

Si el objetivo es crear una aplicación iOS, el software deberá ejecutarse sobre un sistema operativo MAC, puesto que no está disponible el SDK de iOS para otros sistemas operativos.

Finamente, si se pretende firmar una aplicación Android, los argumentos que necesita el programa son los siguientes:

 Plataforma destino

 Nombre de la aplicación que va a ser firmada

 Nombre del autor

 Contraseña para la clave RSA que se usará durante el proceso de firma

 Contraseña para el almacén de claves que se creará para almacenar la clave anterior Al analizar los resultados obtenidos tras la realización del proyecto se obtiene que el softare desarrollado cumple los requisitos iniciales: migrar las aplicaciones generadas por la plataforma SATIN a entornos nativos para iOS y Android.

(9)

Por otra parte, se han analizado algunas aplicaciones creadas con este proceso para comprobar el acceso de las mismas a las APIs nativas del dispositivo, así como evaluar la eficiencia de las aplicaciones finales. Los resultados de este análisis son positivos, indicando que es posible crear aplicaciones móviles nativas de cierta calidad con este proceso.

En cuanto a la comparación establecida entre Apache Cordova y Titanium Appcelerator, los principales puntos a destacar son los siguientes:

 Ambas herramientas son open-source y su uso es gratuito (al menos con los fines de este proyecto).

 La eficiencia de las aplicaciones finales obtenidas con ambas herramientas es equivalente en términos de velocidad.

 La mayor diferencia entre ambas herramientas es el tamaño de las aplicaciones creadas. En el caso de Apache Cordova las aplicaciones tienen un tamaño de 600KB una vez instaladas en el dispositivo, mientras que el tamaño equivalente para las aplicaciones obtenidas con Titanium Appcelerator es de 16MB. Esta diferencia de tamaños se debe a que Titanuim incluye en las aplicaciones los módulos necesarios para acceder a todas las APIs del dispositivo, mientras que Cordova incluye únicamente los módulos correspondientes a las APIs que realmente usa la aplicación.

 En cuanto a las plataformas nativas disponibles para ambas herramientas, Apache Cordova presenta algunas más que Titanuim Appcelerator, como Firefox OS o Ubuntu.

No obstante, ambas herramientas incluyen Android e iOS, que son el objetivo de este proyecto.

Para terminar, cabría destacar dos posibles mejoras para el software desarrollado: la primera consiste en la integración del programa ^Web2Native en el servidor de la plataforma SATIN y la segunda consiste en la posibilidad de añadir más plataformas nativas para las aplicaciones migradas aparte de Android e iOS.

(10)

(11)

A C K N O W L E D G E M E N T S

The work presented in this Master Thesis has been performed during the period January to June 2014. The investigation and development has been done within the Computer Science, Electrical and Space Engineering department of Luleå University of Technology with the collaboration of CodeMill Company.

First of all, I would like to thank Kåre Synnes and Jan-Olov Johansson for their technical advice, recommendations and supervision, which played an indispensable role on the work of this Master Thesis.

I am indebted to my parents, Fernanda and Manuel, my sister Marina and my aunt Maria del Carmen for always supporting and believing in me. Special thanks also to Daniel Jiménez Anero for being by my side all this time and helping me to make this possible.

Lastly, to the rest of my family, friends and all those who in one way or another participated and helped me to achieve this goal.

Manuel Cerrillo Bermejo June 2014,

Luleå, Sweden.

(12)

(13)

A B S T R A C T

Technological development is growing every day in our society, it is becoming very common to find new devices in our daily lives with different purposes, such as improving our health, facilitate our communications or enhance our leisure activities.

This tendency will keep growing with the development of the Internet of Things (IoT) so we will be gradually moving to a new society surrounded by devices such as smartphones, tablets, laptops, smart TVs, health bracelets, etc.

Among all those devices, smartphones have a very important role to play as they are a very important part of all our activities and they can control other devices. For this reason, it is important that all the people know not only how to interact with smartphones but also how to make them fit the needs of each one of us so they can better fulfil its purpose.

In order to make that possible, it is necessary to create development platforms where users without programming skills can develop applications for their smartphones so they can feel closer to the devices. SATIN web tool-kit is one of these platforms where people can build new services even if they don´t know how to program.

One possible way to encourage people to be involved with this idea is to offer them the chance to sell the final applications they create so they can make some money at the same time they are creating new services for smartphones.

Nowadays, it is easier to sell a native application than a web site, especially if the application is being sold by a user and not by a company. However, in its current state SATIN web tool-kit only generates (and deploys) web applications, that is why the purpose of this Master Thesis is to improve the platform so it can create native applications from the web code currently generated.

In this way, it will be possible for the users to sell the applications developed as these apps will be sold through the specific platform markets, such as Google Play for Android OS or Apple App Store for iOS.

(14)

(15)

13 | L u l e å T e k n i s k a U n i v e r s i t e t TABLE OF CONTENTS

RESUMEN ... 4

ACKNOWLEDGEMENTS ... 9

ABSTRACT ... 11

Introduction ... 16

About SATIN ... 17

Is it possible to migrate SATIN apps? ... 19

Why Java ... 20

4.1 Introduction to Java ... 20

4.2 WORE criteria ... 20

4.3 Java Virtual Machine ... 21

4.4 Motivations for selecting Java ... 22

Tools ... 23

5.1 Tools for migrating applications: Apache Cordova ... 23

5.1.1 Basic components ... 23

5.1.2 The Command-Line Interface ... 24

5.1.3 PhoneGap ... 24

5.2 Tools for signing Android Applications ... 24

5.2.1 Keytool ... 24

5.2.2 Jarsigner ... 25

5.2.3 Zipalign ... 25

Prerequisites ... 26

6.1 Java ... 26

6.1.1 Java Development Kit and Java Runtime Environment 1.7 for Windows ... 26

6.1.2 Java Development Kit and Java Runtime Environment 1.7 for Linux ... 27

6.1.3 Java Development Kit and Java Runtime Environment 1.7 for MAC OS X ... 27

6.2 Apache Ant ... 28

6.2.1 Apache Ant for Windows ... 28

6.2.2 Apache Ant for Linux and MAC OS X ... 29

6.3 Android Software Development Kit ... 29

6.4 iOS Software Development Kit ... 30

6.4.1 Previous considerations ... 30

(16)

6.4.2 Installation of the SDK: Xcode ... 30

6.5 Apache Cordova ... 31

6.5.1 Node.js ... 31

6.5.2 Cordova Command-Line Interface ... 32

6.6 Checking prerequisites in Linux ... 32

Web2Native... 33

7.1 Console ... 33

7.2 WebParser ... 33

7.2.1 Jsoup library ... 34

7.3 Web2App ... 35

Correct use of the developed software ... 37

8.1 Web2Native.jar on Windows and Linux ... 37

8.2 Web2Native.jar on MAC OS X ... 38

8.2.1 Target platform: Android ... 38

8.2.2 Target platform: iOS ... 39

8.3 Signing an Android application ... 40

8.4 Signing an iOS application ... 41

Results ... 43

Apache Cordova vs Titanium Appcelerator ... 45

Future work ... 46

References ... 47

(17)

15 | L u l e å T e k n i s k a U n i v e r s i t e t TABLE OF FIGURES

Figure 1: SATIN graphical interface – main page ... 17

Figure 2: SATIN graphical interface - joining components ... 18

Figure 3: Java application over different OS ... 21

Figure 4: Graphical Interface of the app My Location ... 43

Figure 5: Graphical Interface of the app Random Charts ... 44

(18)

I n t r o d u c t i o n

1

The SATIN project is a tool-kit for visual programming where users can create mobile apps without having traditional software programming skills.

With this purpose, SATIN allows users to create web applications in a very easy way: in a graphical environment, they just need to drag the selected components to the main canvas and join them.

Once the components are joined and everything is ready, SATIN deploys automatically the application and provides the users with the public URL of the web project.

In its current state, the SATIN tool-kit generates JavaScript, HTML5 and CSS3 code for web applications which runs over the web browser of the mobile devices. The purpose of this Master Thesis is to migrate the web applications generated into native applications that can run directly over the operating system of the mobile device (i.e., Android, iOS, etc.)

With this improvement, the automatic generated applications are expected to be more efficient as they run directly over the operating system of the mobile device so they can use native APIs instead of just the available tools for the web browser.

Besides, it is easier to monetize the final applications as they can be sold through the specific platforms for each operating system, such as Google Play for Android or AppStore for iOS.

(19)

A b o u t S A T I N

2

SATIN is a web tool-kit for mobile services programming. It allows the users to easily create mobile applications even without having traditional software development skills.

Some possible applications for SATIN tool-kit in its current state could be the following:

 Constructing the first prototypes of mobile services.

 Creating entire mobile services for companies or individual developers.

 Using IoT sensors and Open Data in order to create “Smart City” services.

 Providing a platform where a large group of people can create apps.

 Offering a tool-kit for crowd-based service innovation.

From the user’s point of view, it is really easy to create a mobile application. They will find the following graphical interface:

Figure 1: SATIN graphical interface – main page

The components are placed on the left side. Users can search for one particular component using the search box in the upper left corner or they can just look for it using the category tags or the component list below.

(20)

Once they have found the component they are looking for, they just need to drag the component to the main canvas.

Figure 2: SATIN graphical interface - joining components

The next step is to join all the components using the handle of each component and looking for the matching colors (orange in the example above). When all the components are properly joined, the message “All handles connected” is shown in green color on the right side of the interface.

Using the mobile phone emulator placed at the right side, users can see a demo of the final application, so they can modify position of the components, messages shown, etc.

Finally, when the application is ready the users just need to click on the button “Open app”

placed at the upper right corner and SATIN tool-kit will deploy automatically the web application generated providing a URL to the main page.

From the point of view of developers that want to contribute with SATIN project, they can create new components using the “Component portal”. For creating a new component, developers have to submit the correspondent XML and JavaScript code to the form placed in the submit page. The component is compiled on the SATIN server and submitted to the database. If the upload is correct, the component is immediately available on the SATIN editor to create new services [1,2,3].

(21)

I s i t p o s s i b l e t o m i g r a t e S A T I N a p p s ?

3

As it has been stated before, the purpose of this Master Thesis is to migrate SATIN applications into native apps for different operating systems (aimed to mobile devices), such as Android or iOS.

This section is focused on discussing and analyzing the possibility of migrating SATIN applications into native environments, with special attention to the tool selected for approaching this task: Apache Cordova.

Since 1960s the Internet has been growing very fast until today. This huge development is at the same time cause and consequence of the fact that the Internet has become a very important part of our society. It is known that nowadays we use the Internet in our daily lives for working, communicating with other people, during our leisure time and even to access social services such as paying taxes or consulting the timetables of the public transport.

This importance of the Internet is reflected also in the professional world: nowadays most of the companies offer services through the network so they need developers who can create a web page or program some applications for the cloud. That is why at these days there are more developers specialized in web technologies – such as JavaScript, CSS, HTML, etc. – than in any particular language or platform, which is the case of mobile platforms like Android or iOS.

This fact, along with the recent development and growth of the smartphones, is the reason why companies have been working since some time ago in order to create services and tools allowing web developers to migrate their web applications into native platforms without the requirement of a deep knowledge on the target platform.

Within this context Apache Cordova appears as a tool that allows the users to migrate their web applications into native languages aimed to mobile devices.

On the other hand, SATIN web tool-kit goes a step further by allowing users without knowledge on web technologies to create their own web applications, designed to look as native mobile applications when they run over the browser of a mobile device.

At this point, the work that has to be done regarding these two tools – Apache Cordova and SATIN tool-kit – is combining them, so the users of SATIN (without knowledge on programming) can access the benefits of the users of Apache Cordova and create native applications from the beginning to the end.

From my point of view, it is possible to achieve this goal and the hardest part is to automatize the process so the final program is easy to use at the same time that it runs over the most common operating systems nowadays.

In the results section, it is presented an evaluation of the final software developed during this Master Thesis as well as the limitations of the final native applications obtained.

(22)

W h y J a v a

4

This section is focused on presenting Java and the motivations for selecting it as the language of the software developed during this Master Thesis.

4.1 Introduction to Java

Java is a general-purpose software programming language that is concurrent, class-based and object-oriented. It is designed to have as few implementation dependencies as possible. As we will see along the following subsection, Java follows the WORE (Write Once, Run Everywhere) criteria.

Java programs are compiled into bytecode files (class files) that run directly over the Java Virtual Machine (JVM) independently of the machine´s specific architecture.

The development of Java was started originally by James Gosling, employee of Sun Microsystems, which nowadays has merged into Oracle Corporation. The first release of Java language took place in 1995 as part of the Sun Microsystems´ Java Platform.

The language has certain similitudes with previous languages such as C and C++. It includes some aspects of C and C++ as well as ideas from other languages. However, Java has lower low-level functions than either C or C++ [4].

4.2 WORE criteria

The “Write Once, Run Everywhere” (WORE) or “Write Once, Run Anywhere” (WORA) criteria are the watchword of Java, originated by Sun Microsystems to show the system-independent advantages of the Java language.

The meaning of these criteria is that Java software can be developed everywhere and it will be able to run over any device equipped with a Java Virtual Machine (JVM) as the software is compiled into bytecode files.

Thus, the programmer does not need to make any changes or adjustments to the code generated for running it over one operating system or another or even over mobile devices, smart-TVs, etc [5].

(23)

4.3 Java Virtual Machine

Java Virtual Machine (JVM) is an abstract computing machine. Like a real computing machine, it has an instruction set and manipulates various memory areas at run time. The JVM knows nothing about the Java programming language, it only knows about a particular binary format, the class file (or bytecode) format. Thus, a class file contains JVM instructions and a symbol table, as well as other ancillary information.

Oracle´s current implementations emulate the Java Virtual Machine on mobile, desktop and server devices, but the JVM does not assume any particular implementation technology, host hardware or host operating system.

The next figure shows the process that a Java application follows when running over different operating systems, such as Windows, Linux or Mac [6].

Figure 3: Java application over different OS

(24)

4.4 Motivations for selecting Java

As we have seen along the previous sections, there are several reasons for choosing Java as the programming language for the developed software, such as:

 Java is one of the most popular programming languages in use, with a reported 9 million developers which means that it is easy to find collaborators for improving the final software obtained and integrate it with the SATIN tool-kit.

 Most of the current operating systems run Java so it is effortless to have the developed software running on different machines with Windows, Linux or MAC OS X.

 Java is an open-source programming language which means that it is costless to obtain Java Development Kit (JDK) and Java Runtime Environment (JRE).

 And the most important reason: Java is a cross-platform language, so the final program developed during this Master Thesis will run on different operating systems, such as Windows, Linux and MAC OS X without any adjustments.

(25)

T o o l s

5

This section is focused on presenting the tools used during this Master Thesis in order to migrate the automatic web applications generated by the SATIN tool-kit into native applications.

5.1 Tools for migrating applications: Apache Cordova

Apache Cordova is an open-source mobile development framework that allows developers to create cross-platform applications just programming with conventional web tools such as JavaScript, HTML5 and CSS3.

The applications created using this software run within specific wrappers for each platform and use the correspondent APIs in order to access sensors, data and network status of the devices.

5.1.1 Basic components

The projects created with Apache Cordova depend on a conventional cofig.xml file that contains information about the application and some criteria specifying the way it works, for example, the ^cofig.xml file specifies if the app responds to orientation shifts. This file follows the specification of the W3C regarding Packaged Web App.

The implementation of the final application is the same than a web page, with the default name ^index.html. This file contains the references to CSS files, JavaScript code, images or whatever resource the application needs to work.

The program runs within a native wrapper as a web view that is distributed to platforms such as Google Play on Android or AppStore on iOS in order to be sold.

Finally, the application needs to make a reference to a file called ^cordova.js, which provides API bindings, in order to interact with some specific device characteristics the way native apps do it [7].

(26)

24 | L u l e å T e k n i s k a U n i v e r s i t e t 5.1.2 The Command-Line Interface

The Command-Line Interface (CLI) is a tool provided by Apache Cordova that allows developers to create and build projects for different platforms.

With the CLI, it is also possible to run the built projects in order to test them over a specific emulator for each platform or over real devices [8].

5.1.3 PhoneGap

PhoneGap is a web-based mobile development framework based on Cordova project which offers the same functionality as Apache Cordova and some more features such as PhoneGap Build service that allows developers to compile the source code on a cloud platform [9].

5.2 Tools for signing Android Applications

5.2.1 Keytool

Keytool is a Java program aimed to administer keys and certificates included within the Java Development Kit (JDK). By using this utility, it is possible to control your own public/private certificates in order to provide self-authentication or data integrity through digital signature procedures. The keys created with keytool are stored within a keystore file, which is a database of private keys and the correspondent certificates for the authentication of the associated public keys.

The Keytool program is used by the software developed during this Master Thesis in order to sign the Android applications migrated from SATIN web tool-kit. In particular, keytool is used for creating a public/private 2048 bits key pair using RSA algorithm with a validity period of ten thousand days (which is the minimum value recommended as the apps uploaded to Google Play must have a validity period ending after 22 October 2033) [26,27].

(27)

25 | L u l e å T e k n i s k a U n i v e r s i t e t 5.2.2 Jarsigner

Jarsigner is another Java tool included in the Java Development Kit (JDK). With this tool, it is possible to generate digital signatures for JAR files, using the keys and certificates contained within a keystore file.

The basic functionality of the program is to sign a JAR file with a private key (contained in the keystore) and including inside the JAR file a copy of the certificate authenticating the public key corresponding to the private key used for the signing process. Thanks to including that certificate, it is possible afterwards to verify the digital signature of the JAR file.

The software developed during this Master Thesis uses the tool jarsigner in order to sign the

.apk files containing the applications migrated from SATIN tool-kit using RSA algorithm and SHA1 digest algorithm [28].

5.2.3 Zipalign

Zipalign is a tool included with the Android Software Development Kit (SDK) inside the folder

tools. The main functionality of this tool is to guarantee that all uncompressed data begin with a specific alignment relative to the start of the file.

By forcing alignment at 4 byte boundaries, zipalign provides a performance optimization to the

.apk files when they are installed into a device or emulator. The reason of this optimization is that Android OS, when working with aligned apps, is able to read files using ^mmap() method so it does not need to copy all the data from the application package. The final result is that the application needs less RAM memory of the device when running.

The software developed during the work of this Master Thesis uses the tool zipalign in order to align the final ^.apk files once they are properly signed [29].

(28)

P r e r e q u i s i t e s

6

This section is focused on presenting the necessary requisites for the software developed during this Master Thesis to work over different operating systems.

6.1 Java

The first requisite that is necessary for the developed software to work properly is to install the version 1.7 or greater of Java Development Kit (JDK) and Java Runtime Environment (JRE).

Along the following subsections it is described how to obtain and install properly JDK 1.7 and JRE 1.7 for Windows, Linux and MAC operating systems.

6.1.1 Java Development Kit and Java Runtime Environment 1.7 for Windows

The first step is to download the JDK 1.7 or JRE 1.7 installer from the official oracle web page.

It is important to download the correct installer for the target platform, i.e. 32 or 64 bits.

The second step is to run de JDK or JRE installer file just downloaded. For that, double-click on the installer´s icon and then follow the instructions the installer provides. The installer may ask you to reboot your computer. Once the installation is finished, you can delete the downloaded file to recover disk space.

Finally, it is important to add the full path to the jdk1.7.0\bin directory to the PATH variable.

Typically this full path looks like C:\Program Files\Java\jdk1.7.0\bin. In order to set the

PATH variable on Windows [10,11]:

1. Click Start, then Control Panel, then System.

2. Click Advanced, then Environment Variables.

3. Add the location of the ^bin folder of the JDK installation to the ^PATH variable in System Variables. The following is a typical value for the ^PATH variable:

C:\WINDOWS\system32;C:\WINDOWS;C:\Program Files\Java\jdk1.7.0\bin.

(29)

6.1.2 Java Development Kit and Java Runtime Environment 1.7 for Linux

The first step is to download the archive binary from the official oracle web page. It is important to download the correct file for the target platform: jdk-7u<version>-linux- x64.tar.gz for 64 bits systems or jdk-7u<version>-linux-i586.tar.gz for 32 bits systems and jre-7u<version>-linux-x64.tar.gz for 64 bits systems or jre-7u<version>-linux- i586.tar.gz for 32 bits systems.

The archive binary can be installed by anyone (not only root users), in any location. However, only the root user can install the JDK or JRE into the system location. Change directory to the location where you would like the JDK or JRE to be installed and move the ^.tar.gz file to the current directory.

Unpack the tarball and install the JDK (you may need to run the following command with super root permission):

The Java Development Kit files and the Java Runtime Environment files are installed in a directory called jdk1.7.0_<version> or jre1.7.0_<version> in the current directory.

Add the following lines to the file /etc/profile (you will need to restart the computer for the changes to take effect):

Finally, delete the ^.tar.gz file if you want to save disk space [12,13].

6.1.3 Java Development Kit and Java Runtime Environment 1.7 for MAC OS X

Download the installer from the official oracle web page. Depending on your processor, you will need either jdk-7u<version>-macosx-amd64.dmg or jdk-7u<version>-macosx-x64.dmg

installation file for the JDK and jre-7u<version>-macosx-amd64.dmg or jre-7u<version>- macosx-x64.dmg installation file for the JRE.

From either the Downloads window of the browser, or from the file browser, double-click on the ^.dmg file to launch it.

A Finder window appears containing an icon of an open box and the name of the ^.pkg file.

Double-click on the package icon to launch the Install app. The Install app displays the Introduction window, click Continue.

(30)

The Installation Type window appears, click Install. Enter the administrator login and password and click install software. The software is installed and a confirmation window appears.

Finally, delete the ^.dmg file if you want to save disk space [14,15].

6.2 Apache Ant

The next requisite for the developed software to work is Apache Ant.

Apache Ant is a Java library and command-line tool used to manage building processes that are described by XML files (by default, the build file is called ^build.xml). These files contain targets and extension points dependent upon each other.

Apache Ant is mainly used for Java applications. It allows to compile, assemble, test and run Java programs. Nevertheless, Ant can also be used for building non Java applications, such as C or C++ programs. In general terms, Apache Ant software works with any kind of process that can be described in terms of targets and tasks.

The Apache Ant project is open-source and it is released under the Apache Software Foundation.

Along the following subsections it is described how to obtain and install properly Apache Ant for Windows, Linux and MAC operating systems [16].

6.2.1 Apache Ant for Windows

Download the binary archive from the official web site of Apache Ant. Once the download is completed, unzip the file and rename it to ^ant.

Place the ^ant folder in the directory you want, for example: C:\Program File\ant.

Now, it is necessary to set up properly the ^PATH of the system and the environment variable

ANT_HOME. For that:

3. Add the variable ANT_HOME with the path to the downloaded folder, for example:

C:\Program File\ant.

4. Add to the ^PATH variable the path of the folder plus ^\bin, for example: C:\Program File\ant\bin.

Finally, in order to test if the installation is correct, type ^ant on a new terminal. You should get the message: build.xml does not exist.

(31)

29 | L u l e å T e k n i s k a U n i v e r s i t e t 6.2.2 Apache Ant for Linux and MAC OS X

Download the binary archive from the official web site of Apache Ant. Once the download is completed, unzip the file and rename it to ^ant.

Move the folder to /usr/local (you may need root permission):

Change the directory to that folder and create a link to it:

Modify the global ^PATH variable and create the variable ^ANT_HOME by adding the following lines to the /etc/profile (you will need to restart the computer for the changes to take effect) file on Linux or /etc/bashrc file on MAC:

Finally, in order to test if the installation is correct, type ^ant on a new terminal. You should get the message: build.xml does not exist.

6.3 Android Software Development Kit

The software developed during this Master Thesis needs the Android Software Development Kit (SDK) in order to be able to migrate web applications generated with SATIN tool-kit into native Android apps.

The Android SDK can be downloaded from the official Android developer’s web site as an ^adt-

bundle file. Once the SDK file is downloaded, just unpack the ^adt-bundle in the location where you store development tools, for example a directory called Development.

Finally, it is necessary to add SDK´s ^tools and platform-tools into the global ^PATH environment variable for cordova command-line tools to work. For that, you can add the following line to the /etc/profile (you will need to restart the computer for the changes to take effect) file on Linux or to the /etc/bashrc file on MAC [17]:

(32)

30 | L u l e å T e k n i s k a U n i v e r s i t e t On Windows, follow these steps:

3. Add following line to the ^PATH variable in System Variables: C:\Development\adt- bundle\sdk\platform-tools:C:\Development\adt-bundle\sdk\tools.

6.4 iOS Software Development Kit

6.4.1 Previous considerations

Apple tools required to migrate web applications generated with SATIN tool-kit into iOS native apps run only on the OS X operating system on Intel-based Macs. The minimum required version of Xcode is 4.5 and it runs only on OS X version 10.7 (Lion) or greater. It includes the iOS 6 Software Development Kit (SDK).

In order to upload the final applications generated to the Apple App Store, it is necessary to use the latest version of the Apple tools.

With the iOS simulator obtained by installing SDK and Xcode, it is possible to test the majority of the cordova features. However, it is necessary an actual device in order to test the entire app´s device features before uploading the applications to the App Store. The device used for that must run at least iOS 5.X, which is the minimum version supported.

The supported devices are all iPad models, iPhone 3GS and above and iPod touch 3^rd generation or greater. Finally, for installing apps into a real device it is a requisite to be a member of the Apple´s iOS Developer Program, which cost $99 per year [18].

6.4.2 Installation of the SDK: Xcode

In order to obtain Xcode, there are two options:

 Downloading it from the App Store, available by searching for “Xcode”.

 Downloading it from Apple Developer Downloads. This second option requires registration as an Apple Developer.

(33)

Once Xcode is installed, several command-line tools need to be enabled for cordova to run.

From the Xcode menu, select Preferences, then the Downloads tab. From the Components panel, press the install button next to the Command Line Tools list.

6.5 Apache Cordova

The last requisite for the developed software to work is Apache Cordova, which is the basic tool used for migrating the web applications generated by SATIN tool-kit into native apps for Android and iOS platforms.

Along the following subsections it is explained how to install cordova from a terminal in Windows, Linux and MAC operating systems.

6.5.1 Node.js

The first step is to download and install Node.js from its official web site. Once the installation is completed, it should be possible to run ^node or ^npm commands on the terminal (in all Windows, Linux and Mac operating systems).

Node.js is a software platform built on Chrome´s JavaScript Runtime for developing server-side and network applications. The software developed with Node.js is written in JavaScript and it runs within the Node.js runtime. The advantage of this is that Node.js applications run on Windows, MAC OS X and Linux operating systems with no changes.

One of the main things that Node.js applications worry about is efficiency. In order to achieve good levels of throughput, Node.js uses non-blocking input/output operations and asynchronous events. These applications run within a single thread. However, Node.js uses several threads in order to manage file and network events. For all these reasons, Node.js is commonly used for real-time applications.

The core of Node.js is the Google V8 JavaScript engine, which is the responsible of the code execution. The vast majority of the modules are written in JavaScript language.

Other feature of Node.js is that it includes a built-in asynchronous input/output library for managing files, sockets and HTTP communications.

This HTTP and socket support allows Node.js to act as a web server without additional web server software such as Apache [19].

(34)

32 | L u l e å T e k n i s k a U n i v e r s i t e t 6.5.2 Cordova Command-Line Interface

In order to install the Cordova Command-Line Interface (CLI), run the following command on a terminal (same command for all the operating systems, although you may need to add the prefix ^sudo in UNIX systems for installing development utilities in restricted directories):

Once the installation is completed, it should be possible to run the command ^cordova on a terminal window [20].

6.6 Checking prerequisites in Linux

Once the prerequisites are installed and the computer has been restarted in order to the changes to the PATH variable to take effect, it should be possible to create a simple cordova project in order to test if everything works fine.

For that, you can create a simple project called “hello” with the following commands:

If any command produces errors (especially for the cordova build command), then try to install the 32 bits libraries with the following command (you may need root permission):

If you get errors when trying to install those libraries, then install the following libraries manually (you may need root permission):

Once the libraries are installed, try to create again the simple cordova project called “hello”

and now it should work fine.

(35)

W e b 2 N a t i v e

7

This section presents the software developed during this Master Thesis in order to automatize the process of converting the web applications generated by the SATIN tool-kit into native applications for Android and iOS platforms.

The developed software consists of a Java program called Web2Native. The main motivation for developing this software using Java, as it is stated in the section 3.4 of this Thesis, is that it can work with different platforms – all the operating systems supporting Java – as it runs over the Java virtual machine instead of running directly over the target operating system.

The program Web2Native is formed by three main classes – Console.java, WebParser.java

and Web2App.java - that are presented along the following subsections.

7.1 Console

The main functionality of the class Console.java is to emulate a terminal for different operating systems.

This class has two different constructors. One of them is used for building a terminal that can run over Windows operating systems and the other one is used for building a terminal which can work in operating systems with a Linux kernel.

Once the terminal is built, it has a method that executes commands – received as parameters - using the Java classes Process and ProcessBuilder. This method gets the standard output and the standard error output of the command using the Java classes InputStreamReader and BufferedReader. Finally, it returns the standard output and the standard error output of the command.

7.2 WebParser

The main functionality of the class WebParser.java is to download the entire SATIN

application that we are trying to migrate into a native Android or iOS application and store it in the folder structure provided by cordova when creating a new project.

For this to be possible, it is necessary to download not only the main web page of the SATIN application – ^index.html – but also all the resources pointed by this page which are necessary for the application to work properly.

(36)

Unlike the previous class, this one has a single constructor which builds a WebParser object taking as parameters the URL pointing to the SATIN application that we are trying to migrate and the directory in which the cordova project has been created.

Once the WebParser object has been created, it has a method that implements all the functionality of the class with the following steps:

 Firstly, it downloads the ^index.html page of the SATIN application using the Java library Jsoup (described in the section 3.2.1).

 The second step is to obtain a list of all the resources pointed by the index.html file.

For a SATIN application, these pointers are placed inside the html tags <link>,

<script> or <img>.

 Then it checks all the resources in the list. If the resource is a URL pointing to an image, html, JavaScript or CSS files then it downloads and stores the resource using the Java classes URL, URLConnection, InputStream, and FileOutputStream. If the resource is one of the files just mentioned placed in the same server it also downloads and stores it using the same Java classes.

 Finally, it modifies the pointers of the ^index.html file so they point properly to the correspondent resources and it stores the ^index.html.

7.2.1 Jsoup library

Jsoup is an open-source Java library created for working with HTML files. It is useful in order to obtain an API for extracting and manipulating data, using DOM, CSS and jquery-like methods.

This library implements the WHATWG HTML5 specification and parses HTML5 files to the same DOM as a browser. Some of the functionalities provided by this library are the following:

 Scraping and parsing HTML from a URL, file or String.

 Finding and extracting data using DOM traversal or CSS selectors.

 Working with the HTML elements, attributes and text.

 Avoiding XSS attacks by cleaning user submitted content against a save white-list.

In the software developed during this Master Thesis, the Jsoup library is used in the class WebParser.java in order to download the ^index.html file of the SATIN application that we are trying to migrate to a native platform, obtain a list of the resources pointed by this file and modify these pointers once the resources are stored.

(37)

7.3 Web2App

The class Web2App.java implements the main functionality of the program using the services provided by the previous classes.

The main method of this class is the one that is called when starting the program. It checks that the arguments received by the program are correct and it offers some help to the user in case they are not. It also checks the operating system in which the program is running due to the fact that there are some differences in the steps to follow for implementing its functionality depending on the operating system.

Once this method has checked the arguments and the operating system, it calls the method

Web2Android or Web2Ios depending on whether the platform target is Android or iOS. Or the method signAndroidApp in case the user wants to sign an Android application.

Although there are some differences in the operation of the two first methods (and in the operation of Web2Android method depending on the operating system on which the program is running), the basic functionality they implement is the same, and it can be summarized in the following points:

 Firstly, they use the functionality of the class Console.java in order to create the following folder structure if it does not exist:

o Android: the method Web2Android creates the folder AndroidPojects in the directory in which the program has been executed. Inside that folder, it creates the folders WebProjects and AndroidApps.

o iOS: the method Web2Ios creates the folder iOSProjects in the directory in which the program has been executed. Inside that folder, it creates the folders ^WebPojects and ^iOSApps.

 Once the folder structure is set up, they use cordova for creating a new project inside the correspondent WebProjects folder.

 The next step is to download the SATIN application and all its resources and store everything following the folder structure provided by cordova when creating the new project. In order to do this, both Web2Android and ^Web2Ios methods use the functionality provided by the class WebParser.java.

 Then, they use cordova in order to migrate the web application just downloaded from the SATIN tool-kit into a native application of the target platform – Android or iOS - .

 Once the web application is migrated, they use again the cordova functionality in order to build the native application.

(38)

 Finally, the method Web2Android places the ^.apk file – which is the Android application itself – in the folder AndroidApps previously created. In the case of the method ^Web2Ios, there is no file as the ^.apk for Android so the final iOS application is not placed at ^iOSApps folder but it is placed inside the WebProjects folder as an Xcode project.

Regarding the method signAndroidApp, its functionality is explained along the following points:

 At the first place, the method signAndroidApp uses the class Console.java in order to create the folder Keys inside the main directory AndroidProjects, if it does not exist.

 Once the folder ^Keys is created, the method creates a public/private key pair inside that folder, using the algorithm RSA with the java program ^keytool.

 The next step is to sign the application using the RSA key just created. For that, the method uses the functionality of the java program jarsigner.

 The last thing the method does is to align the application in order to provide a performance optimization for the app. In order to do this, the functionality of the java program ^zipalign is used.

(39)

C o r r e c t u s e o f t h e d e v e l o p e d s o f t w a r e

8

This section is focused on explaining the correct use of the software developed during this Master Thesis in order to migrate web applications generated with SATIN tool-kit into native apps for Android and iOS platforms.

Along the following subsections it is explained how to use the file Web2Native.jar on Windows, Linux and MAC operating systems.

8.1 Web2Native.jar on Windows and Linux

If the program Web2Native.jar is running over a Windows or Linux operating system, it is possible only to migrate a web application generated with SATIN tool-kit into a native Android app as it is necessary a MAC OS X in order to generate applications for iOS platform.

In order to migrate the web application into a native Android app on Windows and Linux operating systems, it is necessary to follow the next steps.

The first step is to open a terminal window and change the location to the directory where you want to create the project.

Once the terminal is properly placed at the chosen directory, execute the Web2Native.jar file with the following arguments (Note: both Windows and Linux allow executing a ^.jar file just by dragging it to the open terminal):

 Argument 1: URL of the web application generated with SATIN tool-kit.

 Argument 2: Target platform of the final native app, i.e. ^android.

 Argument 3: Name of the final native application.

If the program executes with no errors, it will create the folder AndroidProjects inside the chosen directory in which the terminal is placed. Inside this folder there will be another two:

WebProjects and AndroidApps.

(40)

Inside the folder WebProjects you will find a folder with the name selected for the final native application. This folder is created automatically by cordova and it contains the folder structure and the necessary information (such as the ^index.html file of the SATIN tool-kit web application and all its resources properly stored) for cordova in order to migrate the web application into a native Android app.

Finally, inside the folder AndroidApps you will find the file containing the native Android application, named with the selected name plus -unsigned.apk. This file is the application itself but it is not signed so it cannot be installed into any device or emulator since Android OS requires that an app is signed in order to install it. In order to sign the application before testing it or uploading it to the Google Play, it is necessary to sign the ^.apk file following the instructions indicated in the point Signing an Android application.

8.2 Web2Native.jar on MAC OS X

If the program Web2Native.jar is running over a MAC operating system, then it is possible to use the entire functionality of the software as it can migrate web applications generated with SATIN tool-kit into native apps for both Android and iOS platforms.

There are slightly differences in the arguments the program need depending on the final platform target. The following subsections explain how to use properly the program

Web2Native.jar in order to migrate the web application into a native app on MAC operating systems for Android or iOS platforms.

8.2.1 Target platform: Android

Once the terminal is properly placed at the chosen directory, execute the Web2Native.jar file with the following arguments (Note: MAC allows executing a ^.jar file just by dragging it to the open terminal):

(41)

 Argument 2: Target platform of the final native app, i.e. android.

 Argument 4: Path to the SDK´s ^tools for Android, for example:

/Users/USER/Development/adt-bundle/sdk/tools.

 Argument 5: Path to the SDK´s platform-tools for Android, for example:

/Users/USER/Development/adt-bundle/sdk/platform-tools.

If the program executes with no errors, it will create the folder AndroidProjects inside the chosen directory in which the terminal is placed. Inside this folder there will be another two:

WebProjects and AndroidApps.

Inside the folder WebProjects you will find a folder with the name selected for the final native application. This folder is created automatically by cordova and it contains the folder structure and the necessary information (such as the ^index.html file of the SATIN tool-kit web application and all its resources properly stored) for cordova in order to migrate the web application into a native Android app.

Finally, inside the folder AndroidApps you will find the file containing the native Android application, named with the selected name plus -unsigned.apk. This file is the application itself but it is not signed so it cannot be installed into any device or emulator since Android OS requires that an app is signed in order to install it. In order to sign the application before testing it or uploading it to the Google Play, it is necessary to sign the ^.apk file following the instructions indicated in the point Signing an Android application.

8.2.2 Target platform: iOS

Once the terminal is properly placed at the chosen directory, execute the Web2Native.jar file with the following arguments (Note: MAC allows executing a ^.jar file just by dragging it to the open terminal):

(42)

 Argument 2: Target platform of the final native app, i.e. ^ios.

If the program executes with no errors, it will create the folder iOSProjects inside the chosen directory in which the terminal is placed. Inside this folder there will be another two:

WebProjects and ^iOSApps.

The folder ^iOSApps is empty because now the native iOS application is not contained on a single file such as the file ^.apk for Android.

Inside the folder WebProjects you will find a folder with the name selected for the final native application. This folder is created automatically by cordova and it contains the folder structure and the necessary information (such as the ^index.html file of the SATIN tool-kit web application and all its resources properly stored) for cordova in order to migrate the web application into a native iOS app.

Finally, in the path WebProjects/APP_NAME/platforms/ios you can find all the resources that the iOS app needs and a file called APP_NAME.xcodeproj. If you click on that file, you can open the final iOS native application with Xcode.

8.3 Signing an Android application

This section explains how to use the software Web2Native.jar in order to sign an Android application. The use of the program in order to achieve this target is exactly the same independently of the operating system on which the program is running; it means that the following instructions are valid for all Windows, Linux and Mac operating systems.

The first step is to open a terminal window and change the working directory so the terminal is placed in the same folder you chose before for creating the Android project, i.e. The same directory where the folder AndroidProjects is placed. According to the examples along the previous sections, this directory would be:

Once the terminal is properly placed at the chosen directory, execute the Web2Native.jar file with the following arguments (Note: all Windows, Linux and MAC operating systems allow executing a ^.jar file just by dragging it to the open terminal):

(43)

 Argument 1: Target platform of the app that is going to be signed, i.e. android.

 Argument 2: Name of the app (without –unsigned.apk) which has to be placed inside the folder AndroidProjects/AndroidApps.

 Argument 3: Name of the author without spaces.

 Argument 4: Password for the RSA key pair.

 Argument 5: Password for the key store that will contain the key.

If the program executes with no errors, it will create the folder ^Keys inside the directory

AndroidProjects. Within the ^Keys folder, you will find a key store containing the key used for signing the application and named with the same name of the app plus ^.keystore.

Finally, inside the directory AndroidApps it is placed the signed application, named with the original selected name plus ^.apk.

8.4 Signing an iOS application

The functionality of signing iOS applications is not included within the software developed during this Master Thesis due to the fact that each user needs to sign its own applications using at the first place an official certificate obtained from Apple when enrolling in the Apple Developer Program.

Along the following paragraphs it is presented a brief description of the overall process, requirements and tools used for signing iOS applications.

At the first place, you need a signing identity that it is used by Xcode in order to sign your app in the build process. This signing identity is provided by Apple and it is basically a public/private key pair and a certificate. The private key is the one used for creating the signature and it is stored within your keychain. The public key is contained in the certificate, which is the responsible of identifying you as the owner of the key pair. This certificate is stored in your keychain and also in our developer account.

It is also required for your keychain to contain an intermediate certificate proving that your first certificate has been provided by a certificate authority.

When you install Xcode, an intermediate certificate from Apple is automatically installed within your keychain and after that, it is necessary that you create your signing certificate in order to sign the applications using Xcode [30].

(44)

Once the previous steps are completed, it is necessary a development certificate identifying you in order to launch your apps into real devices.

Finally, you need a distribution certificate verifying the identity of your team or organization in a distribution provisioning profile in order to be able to submit your apps to the App Store.