Get device detail in PHP

Been using PHP for sometime and now working on mobile domain? The first hurdle you must have faced is 'how to determine the device type in PHP', unless you used HTACCESS for that, which isn't the right approach.
So, here I'm writing a class that will get you pretty much information about the device. You can get more by processing the USER_AGENT string!

<?php
class Detect
{
 public static function systemInfo()
 {
    $user_agent = $_SERVER['HTTP_USER_AGENT'];
    $os_platform    = "Unknown OS Platform";
    $os_array       = array('/windows phone 8/i'    =>  'Windows Phone 8',
                            '/windows phone os 7/i' =>  'Windows Phone 7',
                            '/windows nt 6.3/i'     =>  'Windows 8.1',
                            '/windows nt 6.2/i'     =>  'Windows 8',
                            '/windows nt 6.1/i'     =>  'Windows 7',
                            '/windows nt 6.0/i'     =>  'Windows Vista',
                            '/windows nt 5.2/i'     =>  'Windows Server 2003/XP x64',
                            '/windows nt 5.1/i'     =>  'Windows XP',
                            '/windows xp/i'         =>  'Windows XP',
                            '/windows nt 5.0/i'     =>  'Windows 2000',
                            '/windows me/i'         =>  'Windows ME',
                            '/win98/i'              =>  'Windows 98',
                            '/win95/i'              =>  'Windows 95',
                            '/win16/i'              =>  'Windows 3.11',
                            '/macintosh|mac os x/i' =>  'Mac OS X',
                            '/mac_powerpc/i'        =>  'Mac OS 9',
                            '/linux/i'              =>  'Linux',
                            '/ubuntu/i'             =>  'Ubuntu',
                            '/iphone/i'             =>  'iPhone',
                            '/ipod/i'               =>  'iPod',
                            '/ipad/i'               =>  'iPad',
                            '/android/i'            =>  'Android',
                            '/blackberry/i'         =>  'BlackBerry',
                            '/webos/i'              =>  'Mobile');
    $found = false;
    $addr = new RemoteAddress;
    $device = '';
    foreach ($os_array as $regex => $value) 
    { 
        if($found)
         break;
        else if (preg_match($regex, $user_agent)) 
        {
            $os_platform    =   $value;
            $device = !preg_match('/(windows|mac|linux|ubuntu)/i',$os_platform)
                      ?'MOBILE':(preg_match('/phone/i', $os_platform)?'MOBILE':'SYSTEM');
        }
    }
    $device = !$device? 'SYSTEM':$device;
    return array('os'=>$os_platform,'device'=>$device);
 }

 public static function browser() 
 {
    $user_agent = $_SERVER['HTTP_USER_AGENT'];

    $browser        =   "Unknown Browser";

    $browser_array  = array('/msie/i'       =>  'Internet Explorer',
                            '/firefox/i'    =>  'Firefox',
                            '/safari/i'     =>  'Safari',
                            '/chrome/i'     =>  'Chrome',
                            '/opera/i'      =>  'Opera',
                            '/netscape/i'   =>  'Netscape',
                            '/maxthon/i'    =>  'Maxthon',
                            '/konqueror/i'  =>  'Konqueror',
                            '/mobile/i'     =>  'Handheld Browser');

    foreach ($browser_array as $regex => $value) 
    { 
        if($found)
         break;
        else if (preg_match($regex, $user_agent,$result)) 
        {
            $browser    =   $value;
        }
    }
    return $browser;
 }
}

Now, you can use it like this: 

$detail = Detect::systemInfo();

to check if it's a mobile, you can use,  

if($detect['device']=='MOBILE')
{
/* Your code for mobile devices */ 
}
else 
{
 /* Your code for desktop systems */ 
}

Android Basics: Create a Linear Layout

In previous post we learned how the webpages differ from an android app. This is required so as to understand how to create different view-pages (layouts) for your app. In this post, we'll learn how to create a linear layout for your app. This is pretty simple and a single reading through should do good enough.

A. Create a Sample project:

• Open Eclipse IDE from C:\Program Files\Android\android-sdk\eclipse (assuming that you have installed Android SDK in C: drive).
• Click on File menu->New->Project. From drop down list, select 'Android->Android Application Project'. Click next. Enter Application name as 'My Sample App'. 
• Leave the rest of the two fields until you're developing a professional app. Click next until you reach last screen and click 'Finish'. A large number of files will be added by default to your project.

B. Create a Linear layout:

•  Open 'activity.xml' from 'res/layout' folder. Usually, project hierarchy is shown on the left so you can find it easily from there.
• Delete <TextView> element and change <RelativeView> to <LinearView>.
• Add the orientation attribute to it. This specifies what would be the screen orientation (vertical/horizontal) when the app starts. You can have different orientations for different pages. Add android:orientation as horizontal: <RelativeView android:orientation="horizontal".../>
• <LinearLayout> is a View  group (subclass of ViewGroup that lays out child views in either vertical or horizontal orientation)
• IMPORTANT: Each children of <LinearLayout> appears on the screen in exactly the sequence as specified in XML file.
• android:layout_width and android:layout_height are required for all the views in order to specify their sizes.
• Setting their value to "match_parent" expands the width and height of layout to match as of their parents.

So, your layout has been set. If you would run your app now, you would see 'Hello World' printed on screen in horizontal layout. In next tut, we'll discuss adding text field to this layout.

Migrating from Web to Android

Hello there! If you're here, I assume you're a web developer who is getting to learn Android, much like me. When I dipped into Android, the very first thing that confused me was 'how navigation works in Android apps, like we've several pages in a website which we can create an edit, where to do all such stuff in Android?' and 'what is this all heck of activity and XML files?'. While I had a little (yes, little and theoretical only) experience of Java, I knew about concepts of OOP (Polymorphism, Abstraction, Encapsulation and Inheritance). If you don't know about them, you better check out some links on these topics before returning to this page.
So, the first thing to understand in Android is that, 'Activities' are what we typically call 'pages' in Websites and the much likeinteraction that we did with the UI items in websites (such as with 'buttons ' in a webpage), we do so here with the help of Intents. Intents specify an "app's intent to do something with the app". This can, besides, be used to perform a number of tasks, however, we primarily use it perform interaction between activities. We'll discuss them all later.
So, as many pages your want to have in your app, you'll have to create that many activities. In fact, activities are more closely similar to 'views' and that's exactly what we call in Android.
The following post and the upcoming ones will contain important points, using the standard android documentation from it's site. I hope that i do not sound  confusing and that it helps you out in understanding Android.

1. Building a Simple UI

•  The graphical user interface (GUI) of an app is create using a hierarchy of View and ViewGroup objects. It forms a tree structure where each leaf node can contain either a View object or a ViewGroup object. In simple language, any page can contain a view (page layout) as well as ViewGroup object. And actually, that's how we link Views in Android apps. A basic diagram (above) shows the concept. The LinearLayout and RelativeLayout are the ViewGroup object types which define the type of view layout selected.
•  View objects are usually UI widgets such as buttons, text-fields, like we have them in a typical web page. However, their attribute declaration is different here. Generally, we define everything in an XML file (which we'll discuss later).
•  ViewGroup objects are 'invisible' (yes, they're mere a definition) containers that define how the child views are laid out, such as in a grid or a vertical list.
• UI layout is defined in XML using hierarchy of UI elements.

 Next, we'll discuss how to create a Linear layout in Android. Follow up!

Installing PhoneGap

Hello Dear,
This tutorial covers only the installation of phonegap on your system and not any of the platforms, like android or iOS. It is so because I chose to compile my app online at build.phonegap.com. And if you have no idea about what phonegap is, please read the overview here.
And hey, if you didn't know, you can create your phonegap app without even installing any of the frameworks. This is really fun where you don't have to worry about installing any of the SDKs. You simply create your code and upload it over build.phonegap.com. They then compile your code and return you back the installer file for the intended mobile. The fun part is, you can have installer for any of the platforms (android, ios, symbian,etc.) by simply updating a single code and even without having downloaded any of the needed SDKs. For me, this was very relieving. You can go the other way too, but that's your choice.
The need to install phonegap is that, if you don't install phonegap, you won't know the structure of the directories and files that you may need to create your mobile app. Also, installation of phonegap requires NodeJS. If you're smart enough, you can go for the procedure over here. Other wise, the crunch comes following:

Installing Phonegap:

1.     Download NodeJS (.msi) file from its website (here). The webpage allows you to download it for whatever operating system you're using (Mac, Windows).

2.    Once downloaded, install it using the installer (execute the .exe file of NodeJS)

3.     Open cmd (goto start and type cmd, or you can find it in Start->Programs->Accessories->Command prompt), type npm install -g phonegap

4.     It’ll take a while to download phonegap from registry.npmjs.org

5.     Once installation completes, you can invoke phonegap in cmd for further help by typing ‘phonegap’ (without qoutes)

 

Creating your first mobile app:

1.     Type phonegap in cmd after installation of phonegap

2.     Now, type create my-app. It’ll create a new app named my-app. If the www plugin would be missing, it’ll first install the plugin through download (obviously, you need an active internet connection). Once done, it’ll display created project at c:\users\user\my-app

3.     Now, type cd my-app (change the current directory to project directory)

4.     Now, type phonegap run android. It’ll ask for your GitHub username (if you don’t have a github username, signup for one at github.org)

5.     It’ll ask for your password then. The password will not show in cmd, yet it’ll be typed. So type your password properly.

6.     Once logged in successfully, your app will be zipped and will be sent to github.

7.     On successful compilation at github, it’ll send you back the QR code of the app. You can scan this code with your smartphone and it’ll be installed on your phone through internet.

8.     Enjoy, you first app is done!

In case I've been wrong any where, please correct me by commenting down. I always appreciate that.