Building a Mobile Application - Java Script - Case Study Example

of the of the 30 September Building a Mobile Application Traditionally, mobile phone applications are d and developed by programmers having skills of C language, whether it is an iPhone application or on any other platforms. Likewise, C language is complex and difficult to learn. One cannot just ignore the C language, as it has its prime importance in the field. However, a native application that resides within all the other applications can be developed. A snake game that will be an offline HTML 5 iPhone application requires skills of HTML 5, Java Script and CSS. HTML 5 provides a multi-purpose platform solution. Likewise, there is no requirement for installing a flash player in order to play audio and video. Moreover, it can be completely integrated with Java script and can deploy new structural elements while eliminating traditional tags. As a result, coding is more organized and structured. One more, advantage of using HTML 5 is the local data storage ("Html 5 Advantages "). Clients can access the application even when they are disconnected from the Internet for a short period. Furthermore, it also minimize development cost by giving options such as enhanced interoperability, super visioning elements in a way that may save both cost and time ("Html 5 Advantages "). Java Script has one significant advantage and i.e. almost all the processing is done at the client side rather than processing it to the server side and transferring it to the client side consumes a lot of time and delays. Likewise, layer of Java Script running in the browser services manages all the front end processing and logic that makes the processing faster for a better and robust browsing experience. Moreover, CSS includes a customized style sheet containing one set of content. Developers only have to maintain this set of content by using only a single document in order to change the style. However, CSS has some limitations including no enhanced graphic and design support. Therefore, customization options are also limited. Design As mentioned above, application will be offline. It concludes that there will be a customized icon, startup phase, instinctive display and most importantly, the application will execute regardless of the Internet connectivity. Likewise, the application will provide similar functionality regardless of being connected to the Internet similar to other non-web based applications. However, there are some prerequisites including an access to a server from where a developer can modify HTTP headers on the files that will be used in the application. This activity will add a feature named as offline caching. Apache is a good example of modifying HTTP headers by using htaccess ("How to Make an HTML5 iPhone App, n.d "). Secondly, for instance, developing an application for iPhone, there is a requirement to enable the debug bar in the Safari web browser. However, this option will only facilitate the development process by identifying potential errors related to Java Script. In the testing phase of the developed application this option must be turned off, in order to experience the application. The icon and startup requires an icon, either of a JPEG or PNG format. In case of iPhone, corners of the icons will be curved by default. Developer will need to create a dropshadow with a gloss and apply it to the icon. The size of the icon depends on the phone type and model, as certain phones only allow a specific size. Similarly, for the startup screen, same procedure will be adopted. As per best practice, developers must keep the file size small, although, contents caching is available, still it is recommended ("How to Make an HTML5 iPhone App, n.d "). Moreover, the amount of files is also a consideration, as they are recommended to be as lowest as possible. Furthermore, the scope of the application must also be clear and precise, so that the development phase consumes significant time. Application cache plays a vital role for any mobile application because it facilitates browsers to request in advance for all the contents that are required for a full functional web page. Developers can define some uniform resource locators as an exception. However, it does not pertain to the offline applications. The core element is the list of files that are required to be cached offline, as they will be transmitted with ‘file type’ and header configured to text. As mentioned earlier, that is why there is a requirement for accessing a server that can modify HTTP headers. Secondly, in order to design the screen size, developer codes in an application or ‘app’ mode environment with a constraint of screen size, as it is understood that it may vary from mobile phone models and screen sizes. Likewise, the impact of this activity can be directly on interface of the offline application that is being developed in HTML 5 ("How to Make an HTML5 iPhone App, n.d "). Coding The initial step is to define a markup. The developer will define the markup for an offline snake game as: offline snake The second line of the code identifies the manifest i.e. ‘cache.manifest’ property situated on the HTML tag. This line of code will instruct the browser to cache the web page offline. However, there are some proprietary standards that need to be followed. Some of these standards that are used in the code are presented below with description: iPhone-mobile-web-app-capable: This code represents that the application will be offline. iPhone-mobile-web-app-status-bar-style: This piece of code makes the status and navigation bar unavailable when the application is offline. iPhone-touch-icon: This code represents the pointer for the image that will demonstrate itself as an icon. iPhone-touch-startup-image: This line of code illustrates the URL that links to the startup image Best practices for the coding point of view includes the positioning of CSS at the top and Java Script at the bottom. CSS CSS is similar to the normal web page coding. However, in the context of phone application development, there are some precise CSS rules known as ‘webkits’ may apply. These rules facilitate developers to add animation and other enhanced 3D functions. The code for CSS is demonstrated below. However, the height and width is default for an iPhone. It may change, as it is understandable that al the cell phone models are not similar in terms of size, shape and functionality: body { overflow:hidden; background: #d3d3d3; margin:0; padding:0; } #snake { width: 320px; height: 460px; background:#111; } Java Script Developer can choose modded versions. Java modded version is comprehensively explained below: “Modulus (%) operator returns only the remainder. If either value is a string, an attempt is made to convert the string to a number. For example, the following line of code” ("Modulus (%): Mod « Operators « JavaScript Tutorial ", n.d) var resultOfMod = 26 % 3; would result in the remainder of 2 being stored in the variable resultOfMod. The operator highlights different characteristics for special values as demonstrated below ("Modulus (%) : Mod « Operators « JavaScript Tutorial ", n.d): If the operands are numbers, regular arithmetic division is performed, and the remainder of that division is returned. If the dividend is Infinity or the divisor is 0, the result is NaN. If Infinity is divided by Infinity, the result is NaN. If the divisor is an infinite number, the result is the dividend. If the dividend is 0, the result is 0 After obtaining the modded version of Java Script, there is still one modification that needs consideration i.e. the absence of the keyboard, in case of iPhone. The general overview was that the Java Script operated well on the phone, though, there are always exceptions. After developing the application, testing is essential. Developer will execute the index.html file in the iPhone that will illustrate all the functions of the application that should perform as per requirement. After through testing, the next step will be to configure the cache.manifest, therefore, the application will be configured on the actual web server that may apply appropriate configuration parameters and settings. End users will eventually see the offline mode. Furthermore, apart from keeping the files that are required for an offline operation, user data can also be stored in an offline database. In order to add this functionality, two primary API’s requires configuration. The first API is called as ‘localStorage.localStorage’ that is the simplest key value store to be used with a modest API. In addition, developers can also use the below mentioned command for saving user’s score for a game: localStorage.dataToStore = 5; console.log(localStorage.dataToStore); // 5 Developers can also design the application to utilize an offline SQL engine known as web database. The first intent is to retrieve a database object and the code follows as: var db; try { if (window.openDatabase) { db = openDatabase("Example Note", "1.0", "HTML5 Database API Note example", 200000); if (!db) alert } else alert } catch(err) { } db.transaction(function(tx) { tx.executeSql("SELECT COUNT(*) FROM WebkitNotes", [], function(result) { loadNotes(); }, function(tx, error) { tx.executeSql("CREATE TABLE WebKitNotes (id REAL UNIQUE, note TEXT, timestamp / REAL, left TEXT, top TEXT, zindex REAL)", [], function(result) { loadNotes(); }); }); }); // Insert a example Note. var note = { id: "1", text:" This is an example note", timestamp: "112123000", left:10, top:10, zIndex:2 }; db.transaction(function (tx) { tx.executeSql("INSERT INTO WebKitNotes (id, note, timestamp, left, top, zindex) VALUES / (?, ?, ?, ?, ?, ?)", [note.id, note.text, note.timestamp, note.left, note.top, note.zIndex]); }); // Get all the notes out of the database. db.transaction(function(tx) { tx.executeSql("SELECT id, note, timestamp, left, top, zindex / FROM WebKitNotes", [], function(tx, result) { for (var i = 0; i < result.rows.length; ++i) { var row = result.rows.item(i); var note = new Note(); note.id = row[id]; note.text = row[note]; note.timestamp = row[timestamp]; note.left = row[left]; note.top = row[top]; note.zIndex = row[zindex]; if (row[id] > highestId) highestId = row[id]; if (row[zindex] > highestZ) highestZ = row[zindex]; } if (!result.rows.length) newNote(); }, function(tx, error) { alert(Failed to retrieve notes from database - + error.message); return; }); }); if (!db) alert In the above mentioned code, alert originates when the version is dissimilar or not enough disk space as per allocated space quota on the domain. } else alert In the above mentioned code, database is not able to open the database and suggest initializing the web kit with the feature activated. If issue still persists, restart or reset the database. Usability and Skills It is obvious that there are some mandatory skills that are essential in order to build any mobile phone application. However, due to evolution in technology, the trend has now transformed in to developing web enabled application. Likewise, trend has also changes in terms of popularity of mobile phone products. For instance, Apple’s iPhone has a different platform as compared to Symbian or windows mobile based smart phones. Therefore, mobile phone developers need to update their skills by evaluating market requirements of a particular mobile product platform. The first thing an iPhone developer will do is to buy a Macbook, as the platform is completely dissimilar to Windows and Android mentioned earlier. However, it is not necessary to buy a netbook or a laptop, as they only provide convenience in terms of mobility and data travelling. The next step is to download a software development kit from Apple’s website, as it is free of cost. The kit contains all the essential elements required for developing a mobile phone application. It includes Xcode, performance analyzers, iPhone simulator for testing the application, reference library for comprehensive documentation etc. The third vital step is to learn and train C language. C language was created by Steven Jobs, who was the owner of Next Computing. Steve Jobs returned to Apple and he sold the company to Apple, since than C is still one of the development environments of Apple Mac (Bennett, Brad Lees and Fisher 350).This is the primary requirement for building an iPhone application, as it include object oriented principles and fundamentals makes the coding phase easier. Likewise, C language also includes scripting functions that may be easier for developers with coding background. However, anyone with no programming concept will find it difficult to learn. Consequently, C language is a requirement for a developer. Moreover, Java language is essential as it is usually involved within the application development process. Likewise, Java ME that constructs portable applications. Usually, Java ME is used to produce generic mobile phone applications. Phone application developer must show expertise on Java ME as this is a basic requirement. Adobe Flash lite, Python and Apple’s proprietary application development platform known as Xcode development language is highly desirable to earn a well-paid job in the market. In terms of platforms, developer must be aware of standard platforms including, Symbian, Android, Qt (framework), BREW that is used for installing applications on CDMA devices, Palm OS, Flash Lite and iOS (Apple) are highly recommended for a good position. Work Cited "Html 5 Advantages "Web, n.d. 9/29/2011 . Bennett, Gary F., Brad Lees, and Mitchell Salem Fisher. Objective-C for Absolute Beginners: IPhone and Mac Programming made Easy . ApressPrint. "Modulus (%) : Mod « Operators « JavaScript Tutorial, n.d "Web. 9/29/2011 . "How to Make an HTML5 iPhone App "Web. 9/29/2011 . Read More