Paul Labis

Encrypt and decrypt files in Ubuntu with ccrypt

2011-12-28T17:00:00.000-08:00

ccrypt is a utility for encrypting and decrypting files and streams. It was based on Rijndael cipher, which was chosen candidate by U.S. government's for Advance Encryption Standard. This cipher is believed to provide a very strong security.

1. Install CCrypt from repo

sudo apt-get install ccrypt

2. To encrypt a file, use one of the following command,

ccrypt -e file_name or ccencrypt file_name

3. It will prompt you for Encryption Phrase aka Password, enter it. for example,

ccrypt -e sample.text
Enter encryption key: your_key
Enter encryption key: (repeat) your_key

Note: Don't forget the encryption phrase, there is no way to get back the original file without it.

To decrypt file/files, use one of the following commands:

ccrypt -d file_name or ccdecrypt file_name

It will prompt you for encryption phrase, enter it. Original file is brought back!

To change the encryption key, ccrypt -x file_name

I guess that is all there is to share. Good luck!

How to Backup and Restore PostgreSQL Database

2011-10-10T09:43:00.000-07:00

There is an easy way to create backup file and restore your current PostgreSQL database using the Linux terminal. I am not sure though if this is the easiest way.

As of the moment I am writing this article, I used the following command to backup and restore my database.

Using pg_dump and psql will make your life easier. Below are the terminal command I use to backup and restore my database.

Backup : pg_dump -U {user_name} {database_name} -f {backup_file_name}
Restore : psql -U {user_name} -d {database_name} -f {backup_file_name}

If you are getting an error:

psql: FATAL: Ident authentication failed for user "username"...

You then need to locate file pg_hba.conf and add or change if already existing to look something like below:

local all all trust
host all 127.0.0.1/32 trust

By the way, to locate file on your Ubuntu... Just run command "locate pg_hba.conf" on your terminal.

After which, restart PostgreSQL database by running "sudo /etc/init.d/postgresql_version restart". Hopefully the error should already be fixed.

There are lots of articles online that you can read to backup and restore you database. I hope this article helps you in one way or another.

I give all credits to www.thegeekstuff.com for doing a good job on explaining how you can use pg_dump and psql to backup your PostgreSQL database.

Recover Ubuntu Grub2 After Windows Installation

2011-10-05T23:42:00.000-07:00

A month ago I decided to dual-boot my laptop with windows 7 and Ubuntu 10.04 version as my main operating system. So I first installed Ubuntu 10.04 then Windows 7 afterwards. After installing Windows 7, ubuntu distribution isn't accessible. I am not sure but I think Windows installation might have wiped out Ubuntu grub.

To be able to recover Grub2 menu along with the option to select either which operating system you want to use, I did the following recovery steps below.

Boot from Ubuntu Live CD - any Ubuntu distribution is okay to use for as long as you get access to linux terminal or bash shell.
Run command "sudo fdisk -l" - this is to find out where your Linux distribution is located or installed. For instance, in the image below, my Linux is installed on sda1.
Run command "sudo mount /dev/sda1 /mnt" - this is to tell Grub that your primary Linux is installed on such location. It should be pretty strait forward.
Run command "sudo grub-install --root-directory=/mnt/ /dev/sda" - this is to re-install/restore your Grub2 menu with option to boot to your Windows 7 operating system.
Reboot your system either on GUI or bu running commands(eg. sudo shutdown -r now). You can already remove the Live CD now.
After reboot, you should update Grub2 by running command "sudo grub-update".

That is all you need to do! Easy isn't it? Unlike other ways, the steps above are simplest because you don't need to edit files.

I hope you find this article helpful and thanks for reading.

Like everyone else, I also did research and all credits to ulyssesonline.

Install NVIDIA driver manually for Asus K43 SV with Ubuntu Lucid 10.04

2011-08-20T21:20:00.000-07:00

I just bought a new laptop Asus K43 SV and installed Ubuntu Lucid 10.04 LTS stable release. It has an i5 2nd generation processor with 4Gb of memory and 1 Gb of VRam. So far, I think this is the most affordable laptop I can look for in Philippine market offered free delivery through LBC by www.pccorner.com or www.laptopking.com from your online purchase.

Some of you might have difficulties in installing NVIDIA driver on your new bought Asus K43 SV laptop. I started researching online and found that there is a default yet not installed NVIDIA driver on synaptics. However, I had been screwing my desktop and as a result, I had to reformat my laptop again and again. I always backed-up my xorg.conf file but had difficulties on restoring it. Anyway, thats the end of story and in this article, I'm gonna share how to easily install NVIDIA driver manually on your k43SV.

STEP 1: Download the driver from www.nvidia.com/Download/index.aspx. See below the form I filled up to download the driver. There is another option below. Either way works! Important thing is that you download the correct driver for you VRam. For me, I had downloaded the file named NVIDIA-Linux-x86_64-280.13.run for my Lucid 10.04 64-bit OS.

STEP 2: Install the driver. Follow the steps bellow.

hit keys Ctrl + Alt + F1 to login on tty1 - you'll be in command line mode
login with your username and password
kill x server by running command "sudo /etc/init.d/gdm stop"
install driver by running command "sudo chmod +x /path/to/file/driver.run | sh /path/to/file/driver.run" - it will show you a step-by-step command line interface installation process which requires you to read and choose answer. It should be strait forward enough for anyone to handle so you'll be fine.
start x server by running command "sudo /etc/init.d/gdm start"
restart your computer to see fresh Ubuntu UI running nvidia driver by running command "sudo reboot"

That is all that you need to do and your done. I hope this article helped with your problem. Enjoy and have fun with Ubuntu!

Commons Email - Examples

2011-07-26T09:35:00.000-07:00

I found another good apache tool for sending emails.

Its easy to use and has good documentation.

Below is an example of an easy way to sending an email.

It is explained properly on apache user guide page which is embedded on the bottom part of this article.


import org.apache.commons.mail.*;
...

 // Create the attachment
 EmailAttachment attachment = new EmailAttachment();
 attachment.setPath("mypictures/john.jpg");
 attachment.setDisposition(EmailAttachment.ATTACHMENT);
 attachment.setDescription("Picture of John");
 attachment.setName("John");

 // Create the email message
 MultiPartEmail email = new MultiPartEmail();
 email.setHostName("mail.myserver.com");
 email.addTo("jdoe@somewhere.org", "John Doe");
 email.setFrom("me@apache.org", "Me");
 email.setSubject("The picture");
 email.setMsg("Here is the picture you wanted");

 // add the attachment
 email.attach(attachment);

 // send the email
 email.send();

Source: Commons Email - Examples

Sending Mail with SMTP

2011-07-26T03:59:00.000-07:00

I was was having problem on sending emails through Java.

I researched and found this apache API SMTP for sending email.

I just want to share this simple tutorial article on Discursive blog to everyone who needs it.

10.16. Sending Mail with SMTP | Discursive

Check Ubuntu laptop temperature

2011-07-01T00:01:00.000-07:00

I noticed my laptop temperature is getting hotter. I was a bit worried so I made a little research on how to check the temperature via the internal chip sensors and Ubuntu terminal/command line. The quickest way so far is through below:

1. Make sure you lm-sensors are already installed. (In latest version as of 2010 - this was already configured) To know more about it goto http://packages.ubuntu.com/lucid/lm-sensors

2. Open you terminal/command line and enter the command "sudo sensors-detect". You will be asked which hardware sensors to scan. Answer it yes or no.

3. Get the temperature by running command "sensors" on your terminal.

There we have it! Thats how I check my laptop temperature. There other ways to check and are probably better and accurate. Have fun and enjoy.

April Blogging Comeback

2011-04-25T16:01:00.000-07:00

Oh yeah! Techieboy is back in sharing his experiences!

Its been a while since I created an article on my experiences with technology. It was around October last year since I stopped due to busy schedules and work. I was also sent to Chicago, Illinois to assist our company client.

It had a wonderful experience though. I was able to see and experience what politics was in software industry. I was exposed to high-end technologies such as Spring Roo and JQuery. Learn a lot on how to deal with management stuff particularly on strategies of motivating employees to make them productive. I had been quite on most of the time, but, I am very observant of thing happening around me.

Anyway, I will cut this article for now. There will be a lot of articles coming up in few days. Have fun and keep in-touch.

DDSteps Testing with Ant Tutorial

2010-09-24T05:48:00.000-07:00

It has been almost a year that I've been using DDSteps for testing a back-end project module and I haven't been able to share or create an article about it. So to those people reading this article, I hope this helps you get started on DDSteps testing.

DDSteps is an integrated tool stack, combining the best open source testing tools for Java and adding the ability to resuse test cases and test data.

DataDriven so that when you want to test "sign up" on your site, you can test the same flow with both "George Bush" and "Владимир Путин". Just add another row to spreadsheet, that's all! - by ddsteps.org

In this tutorial, I will discuss a little about this simple java application I made focus on testing and generating html test results using ant. We will not deal much on the theories since those kind of information are already provided on www.ddsteps.org. I usually use eclipse as my preferred IDE in developing the application. The application makes use of ant to generate the HTML JUnit reports.
Alright! To get started with the app, I created first the project. Observe the files and directory structure. Below is the screenshot of my eclipse project.

Calculator.java - Is a simple app that contains calculateTotal(...) method that simply adds to float parameter.
CalculateDDStepTestCase.java - Is the class that extends DDStepsSpringTestCase. This class maps the fields(columns) and methods(sheet name) on the excel file. This is also the test class.
CalculateDDStepTestCase-applicationContext.xml - Contains configuration and related settings for the data source definition and many other...
CalculateDDStepTestCase.xls - Contains test cases. Each row is a scenario. Every column represents a field. Every sheet represents a test method.
ddsteps-context.properties - It is where you put config variables or properties.
build.xml - Has the ant script responsible for running and generating html test results.

Alright then! I just gave you a little overview on project I did. For you to be able to experiment more, you should download this project. Click HERE to download!

DDSteps is pretty simple to implement and its great testing tool. I hope this example project helps!

Fix upside-down or inverted webcam on Ubuntu linux

2010-08-08T08:47:00.000-07:00

I am running Lucid Lynx 64 bit OS version on my Asus i3 K52J Series laptop. Like everyone else, I like using Skype video/chat as well as Cheese camera for taking pictures and videos. Not until then when I had a problem using it.

NOTE: Not advisable to do "export LIBV4LCONTROL_FLAGS=3", LIBV4LCONTROL_FLAGS is for debugging purposes only. - by Hans De Goede(libv4l author and maintainer)

I was so disappointed that my camera display was inverted! I tried reading several blogs and posting comments on Ubuntu forum threads online for days and but none of their solutions helped solved my problem. It could have been easily solved if only there was an option to invert my camera on Video4Linux Device Preference. Sadly, there was not! So, I decided to find a way to flip the camera by looking into export options on gtk-v4l(Video4Linux).

Below are the 2 things I did to solve my problem.

1. Add software source where libv4l-0 can be downloaded and install it by running the commands below on your terminal.

echo -e "\n# libv4l PPA\ndeb http://ppa.launchpad.net/libv4l/ppa/ubuntu `lsb_release -c | awk '{print $2}'` main" | sudo tee -a /etc/apt/sources.list
sudo apt-key adv --recv-keys --keyserver keyserver.ubuntu.com C3FFB4AA
sudo apt-get update
sudo apt-get install libv4l-0

2. Start cheese or skype from your terminal. (Note: The value of 3 on LIBV4LCONTROL_FLAGS flips the image both vertically and horizontally.)

export LIBV4LCONTROL_FLAGS=3 && cheese
export LIBV4LCONTROL_FLAGS=3 && LD_PRELOAD=/usr/lib32/libv4l/v4l1compat.so skype

Alternatively, you can create a shortcut(custom application launcher) on your menu or on one of your panels.

Download skype and cheese scripts.
Add custom application launcher on panel and point command to respective bash scripts.
Click icon and start using the applications normally!

If your having problem on your sound device on Skype, take a look on my previous article on fixing sound device. Alright then, thats all I did folks! Hope this helps. Have a good one.

Fix Asus K52J Sound or Speaker Problem

2010-08-08T07:18:00.000-07:00

I just got a new replacement company laptop for my 2 year acer dual core laptop. I now have Asus i3 K52J Series Laptop. Like everyone else using Lucid Lynx on their Asus. I had a problem with my sound and audio device and drivers.

Some of my problems were:

Speakers do not mute when headphones are plugged in.
HDMI sound out not working.
External microphone not working.

Thanks to this Ubuntu Forums Thread where a fix is posted though incomplete in my case. So, I decided to create one of my own and hope to help someone else looking for a solution online. The steps below are the things I did fixing this problem.

Download linuxtant alsa driver at www.linuxant.com. The file you need is alsa-driver-linuxant_1.0.23.0_all.deb.zip.
After downloading, extract the file and install by using gdebi-gtk(eg. gdebi-gtk alsa-driver-linuxant_1.0.23.0_all.deb).
Open a terminal and run command "$alsamixer"
Unmute S/PDIF (you can do that pressing "m")
Below is a screenshot of my alsamixer with a headset attached to audio jacks.

Alright then, your set and ready... Hope this article helps! Have a good one...

Use Arguments on Property File

2010-05-29T20:30:00.000-07:00

The goal on this tutorial is to be able to format a value on a properties file given its parameter or arguments. It is best describe as passing value as a parameter and inserting those values on the string retrieved from the properties file.

To better understand what I'm doing, read and understand my example code below.

Property File Sample

message.welcome= Welcome {0} to {1}!
message.thank= Thank you for you visit {0}.

Java Code using ResourceBundle and MessageFormat

ResourceBundle resBundle = new ResourceBundle("path to property file"); 
String welcomeText=resBundle.getString("message.welcome");
MessageFormat msgFormatter = new MessageFormat(welcomeText);

// Create the dynamic args you want to replace
Object[] messageArguments = {"Techie boy","Philippines"};  

String finalText= msgFormatter.format(messageArguments);

The finalText will result to "Welcome Techie boy to Philippines!"

Embedded Jetty in Spring MVC, IoC/DI

2010-05-26T09:41:00.000-07:00

I was trying to configure embedded jetty in a spring application that implements MVC(Model View Controller). I want to utilize single spring applicationContext xml file for IoC(Inversion of Control) and DI(Dependency Injection) on dispatcher servlets.

The goal is to be able to use or reference beans configured/located on already been loaded spring application context. Read and understand my resolution below.

This is what my main method look like:

LOG.info("Application starting");
_applicationContext = new ClassPathXmlApplicationContext(_resourceLocations);

_webServer = new Server();
SelectChannelConnector connector = new SelectChannelConnector();
connector.setHost("localhost");
connector.setPort(8080);
_webServer.addConnector(connector);

WebAppContext webAppContext = new WebAppContext(_webServer, "path to web app folder", "/");

GenericWebApplicationContext webApplicationContext = new GenericWebApplicationContext();
webApplicationContext.setServletContext(webAppContext.getServletContext());
webApplicationContext.setParent(_applicationContext);

webAppContext.getServletContext().setAttribute(WebApplicationContext.ROOT_WEB_APPLICATION_CONTEXT_ATTRIBUTE, webApplicationContext);
webApplicationContext.refresh();

ServletHandler servletHandler = new ServletHandler();

ServletHolder servletHolder = new ServletHolder(new DispatcherServlet());
servletHolder.setName("dispatcher");
servletHandler.addServlet(servletHolder);

ServletMapping servletMapping = new ServletMapping();
servletMapping.setServletName(servletHolder.getName());
servletMapping.setPathSpec("*.htm");
servletHandler.addServletMapping(servletMapping);

webAppContext.setServletHandler(servletHandler);
_webServer.addHandler(webAppContext);

RequestLogHandler logHandler = new RequestLogHandler();
NCSARequestLog ncsaLog = new NCSARequestLog();
ncsaLog.setExtended(true);
ncsaLog.setFilename("logs/jetty-yyyy_mm_dd.log");
logHandler.setRequestLog(ncsaLog);
_webServer.addHandler(logHandler);

LOG.info("Starting main application context");
_applicationContext.start();

LOG.info("Starting Jetty Server");

try {
_webServer.start();
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}

LOG.info("Application started");
return null;

The idea is that DispatcherServlet's context is child context of GenericWebApplicationContext which in turn is a child of ClassPathXmlApplicationContext. Explicitly invoking setParent() gives you the access to all beans from the web application context.

Hope this helps. Feel free to leave your comment or suggestions.

SVN error on Eclipse: org.tigris.subversion.javahl.ClientException: Attempted to lock an already-locked dir

2010-05-22T01:31:00.000-07:00

I met an svn eclipse error while attempting to committing to svn repository. I was thinking I might aswell share how I resolve this problem to everyone.

SVN error on Eclipse: org.tigris.subversion.javahl.ClientException: Attempted to lock an already-locked dir
org.tigris.subversion.javahl.ClientException: Attempted to lock an already-locked dir
svn: Working copy ‘D:\htdocs_svn\sites\all\modules’ locked
org.tigris.subversion.javahl.ClientException: Attempted to lock an already-locked dir
svn: Working copy ‘D:\htdocs_svn\sites\all\modules’ locked

To be able to get rid of it, I did the following:

1. Right click on project folder

2. Goto Team and click Cleanup

3. Try to commit again

In my understanding, it happens when there is a pending session which already locked the working directory copy. So, to get rid of it.. You'll need to remove the old session by deleting them through svn cleanup.

Good luck!

I'm still breathing

2010-05-22T01:10:00.001-07:00

It's been a while since my last post! I had been very busy lately with my work... I miss writing articles. After weeks of hardcore work, I've learn a lot about spring and jetty and I would say, its worth working hard.

I have this task of setting up a project for development. Its a web application for testing. I've learned embedding jetty in a spring application implementing MVC(Model View Controller) design pattern. Other than that, it builds character. Patience really was important.

Anyway, not good sharing my story. Anyway, I can't wait to share my learnings. Later I'll write about those things I've learned..Just the basics..

Asus PL30JT Technology Business Notebook

2010-04-24T00:40:00.000-07:00

Asus showed a notebook of new businesses, PL30JT at CeBIT 2010, which comes with a stylish design. The new Asus notebook includes Turbo33 technology company claims to improve performance by 33%.

The PL30JT is fueled by Intel Core i5 processor and up to 4 GB of RAM. It is equipped with two graphics cards, the 1GB NVIDIA GeForce 310M dedicated graphics and integrated Intel GMA HD technology with Optimus. The professional notebook comes with a 13.3-inch 1366 × 768 LCD display and support for WiFi. It weighs only 1.7 kilograms, with an 8-cell battery. [via itechnews]

This post Asus PL30JT Technology Business Notebook brough to by Netbook Review. Visit Electronics Review for information about gadget and technology

Lenovo IdeaPad Y460 and Y560 Notebooks

2010-04-23T10:55:00.000-07:00

Lenovo has not forgotten the home users usually at CES 2010, the company unveiled two new models, the Lenovo IdeaPad Y460 and Y560 notebooks, with options on the latest processors Core i3, i5 and i7 Intel. The IdeaPad Y460 has a 14-inch 1366 x 768, Core i3 or i5 processor, ATI Radeon HD5740/HD5650 and up to 320 GB hard drive, while the IdeaPad Y560 has a 15.6 screen inch Core i3, i5 and i7 CPU, ATI Radeon HD5730 graphics and up to 500 GB hard drive.

Both machines have up to 8 GB of RAM, Combo drive blu-ray/dvd and standard WiFi b / g / n. There are also optional Bluetooth, 3G and WiMAX. Include three USB 2.0 ports, a / eSATA combo USB, ExpressCard slot and HDMI, with Ethernet, audio in / out and a memory card reader multiformat. [via slashgear]

This post Lenovo IdeaPad Y460 and Y560 Notebooks brough to by Netbook Review. Visit Electronics Review for information about gadget and technology

Lenovo IdeaPad G460 and G560 Switchable Graphics Notebooks

2010-04-23T10:48:00.000-07:00

The IdeaPad G460 has a 14-inch LED screen with backlight, while the G560 gets a screen of 15.6 inches. They have up to 500 GB of hard disk storage. They start at $ 699.99.

Lenovo also announced the V360 IdeaPad 13.3-inch IdeaPad V460 14-inch laptops SOHO market. They have Switchable Graphics and are powered by 2010 Intel Core processors. Both models starting at $ 749.99.

Lenovo is adding the new IdeaPad G460 and G560 notebook, along with Y560 and Y460. The new IdeaPad is improved by a new Intel Core processor with Intel Turbo Boost, HD integrated graphics and up to 8GB of DDR3 memory. [via itechnews]

This post Lenovo IdeaPad G460 and G560 Switchable Graphics Notebooks brough to by Netbook Review. Visit Electronics Review for information about gadget and technology

ASUS Eee PC 1005P Minimalist Netbook

2010-04-23T10:41:00.000-07:00

Recently, detailed specifications and pictures of 1005P ASUS Eee PC showed on SlashGear, the netbook has a minimalist design with a pretty decent hardware spec.

This netbook features a 10.1-inch screen supports a resolution of 1024 × 600, it also features an Intel Atom N450 (1.66GHz) processor, 1 GB of RAM and Intel GMA 3150 graphics. You can choose between a 160 GB hard drive 250GB and the netbook has WiFi b / g standard, the more impressive as it offers up to 12 hours of battery life.

The Eee PC 1005P is currently available in the UK for £ 242.95, while the 250GB model (1005PE) is the sale of £ 270.34, these prices equivalent to approximately $ 395 and $ 439 respectively. [via product-reviews]

This post ASUS Eee PC 1005P Minimalist Netbook brough to by Netbook Review. Visit Electronics Review for information about gadget and technology

ASUS Eee PC 1001P Netbook

2010-04-23T10:39:00.000-07:00

Plus in Germany, the ASUS Eee PC 1001P has been made available for pre-order costing € 249 which is the equivalent of about $ 357 USD.

The netbook runs Windows XP rather than Windows 7, which we would have expected. It also has a smaller capacity battery than other standard models that will probably limit their use to less than 10 hours. What it does come with a new Intel Atom N450 processor to be launched January 6, which is also the official launch of the Eee Netbook 1001P.

Other features of the netbook include wireless 802.11b / g speeds, 3 x USB 2.0 ports and a 0.3 megapixel webcam. Memory wise it has 1 GB hard disk has a capacity of 160GB. The screen measures 10.1 inches is expected throughout Netbook Eee 1000 series. [via itechnews]

This post ASUS Eee PC 1001P Netbook brough to by Netbook Review. Visit Electronics Review for information about gadget and technology

Dell Vostro 3000 Slim Lightweight Notebook

2010-04-23T10:21:00.000-07:00

Following the V13 Vostro, Dell offers the new Vostro 3000 series, a range of new laptops thin, lightweight and robust design for small businesses. Spurred by the latest Intel Core Series, Vostro 3000 is up to 6 GB of memory.

New Dell Vostro 3000 series includes the 13.3-inch Vostro 3300 which is one of the thinnest commercial 13-inch laptop with integrated optical drive, the 14-inch Vostro 3400 with up to 8 hours of autonomy, and the 17 inch Vostro 3700 with an optional Core i7 quad core processors.

The Vostro 3500 and 3700 models come with LED backlight and it can be equipped with up to 1GB NVIDIA GeForce dedicated. The new Vostro laptops support Bluetooth, WiFi and mobile broadband WWAN optional. These new phones will be released March 16. [via itechnews]

This post Dell Vostro 3000 Slim Lightweight Notebook brough to by Netbook Review. Visit Electronics Review for information about gadget and technology

Add Related Posts Widget to Blogger or Blogspot

2010-04-20T10:02:00.001-07:00

It be better to display related or similar articles below your articles or posts on your blog. This way your readers would easily know that there are related articles you written and they can further read.

The steps to adding related posts widget is easy. It would take less than 3 minutes add it on your blog.

Before starting, make sure to download the related post JavaScript file or ccopy and paste its content to your desired file.js. Then make sure to upload it online where it will be available for import on your template. I recommend you to upload it on Weebly.com, SigMirror.com or HotLinkFiles.com to get a DIRECT LINK to that file.

Step 1: Most important of all, backup your template incase something go wrong or messed up. Goto www.blogspot.com "Layout" portion, then go to "Edit HTML" section. Download present template and make sure to secure the copy on your file storage device.

Step 2: Click on "Expand widget templates" and look for this code:

</head>

and on top of it insert the following code:

<!--RelatedPostsStarts-->
<style>
#related-posts {
float : left;
width : 540px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}

</style>
<script src='http://www.weebly.com/..../relatedposts_forblogger.js' type='text/javascript'/>
<!--RelatedPostsStops-->

Replace the red link above with your own direct link.

Step 3: Look for the code:

<data:post.body/>

Under it, insert the following code:

<!--RELATED-POSTS-STARTS--><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='3'><b>Related Posts: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script></div></b:if><!--RELATED-POSTS-STOPS-->

To limit the maximum number of related or similar articles to display under the post, just change max-results=xx by the number you like.

Finally, save your template and test. Related Posts widget should be located under your article or post. Do remember to add categories or labels before you publish your post. Otherwise, no related post will be displayed.

Hope this tutorial helps.

Tutorial on Android Views - Part 2

2010-04-16T19:57:00.000-07:00

In this article, we will be dealing with another types of Android views. They are the RadioGroup, RadioButton, ProgressBar and AutoCompleteTextView. By learning the following views, it will broaden your understanding on android views that will help you build your own android application.

Lets start by creating a new android project on eclipse. See the screenshot beside for android project specifics.

RadioGroup and RadioButton

This two views is basically used to let users choose something among available options. RadioButton has two available states. It is either checked or unchecked. Once a RadioButton is checked, it cannot be unchecked unless its grouped along with other radio button on a RadioGroup. A RadioGroup is a type of view that is used to group one or mmore radio buttons, thereby allows a user to select only one radiobutton or only one option.

Create new android xml named basicviewspart2.xml under res/layout folder then put the following code:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<RadioGroup android:id="@+id/colorOptions"
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:orientation="vertical"
>

<RadioButton android:id="@+id/red"
android:layout_width="fill_parent" 
android:layout_height="wrap_content"
android:text="Red"
/>
<RadioButton android:id="@+id/blue"
android:layout_width="fill_parent" 
android:layout_height="wrap_content"        
android:text="Blue"
/>   
<RadioButton android:id="@+id/green"
android:layout_width="fill_parent" 
android:layout_height="wrap_content"        
android:text="Green"
/>

</RadioGroup>
</LinearLayout>

Then, update BasicViewsPractice.java by adding the following codes:

package com.app.techie;

import android.app.Activity;
import android.os.Bundle;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;
import android.widget.RadioGroup.OnCheckedChangeListener;

public class BasicViewsPractice extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.basicviewspart2);
        
        RadioGroup colorChoices = (RadioGroup) findViewById(R.id.colorOptions);
        colorChoices.setOnCheckedChangeListener(new OnCheckedChangeListener() {
            
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                RadioButton redOption = (RadioButton) findViewById(R.id.red);
                RadioButton blueOption = (RadioButton) findViewById(R.id.blue);
                RadioButton greenOption = (RadioButton) findViewById(R.id.green);
                
                if(redOption.getId()==checkedId){
                    displayToast("You selected red!");
                }
                
                if(blueOption.getId()==checkedId){
                    displayToast("You selected blue!");
                }
                
                if(greenOption.getId()==checkedId){
                    displayToast("You selected green!");
                }
            }
        });
        
    }

    private void displayToast(String message){
        Toast.makeText(getBaseContext(), message, Toast.LENGTH_SHORT).show();
    }
}

Briefly, the code above simply display a message through Toast. the message indicates what option a user selects. We identified the radiobutton selected using its IDs. The above should look like:

ProgressBar

This view is usually used to indicate that an event, task or an activity is currently ongoing. An example of which is downloading files where progress of download is shown visually though a color bar. This is a good choice to tell the user about the status of the task. For us to understand it better, lets do the activity below.

Lets use same activity created above and update the basicviewspart2.xml by adding the following code:

<ProgressBar
android:id="@+id/normalProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
/>
<Button android:id="@+id/btnDownload"
android:layout_width="wrap_content" 
android:layout_height="wrap_content"
android:text="Download"
/>

On our xml code, we added two views. A progress bar with visibility default to gone so at startup it does not appear on display and a button to do some work or task on background. What we want to do is to simulate progress bar. So, if the user clicks the button, a task is started and the progress bar will display and hide when the task is done.

Update BasicActivityPractice.java to look like this:

package com.app.techie;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.widget.Button;
import android.widget.ProgressBar;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;
import android.widget.RadioGroup.OnCheckedChangeListener;

public class BasicViewsPractice extends Activity {
    private static int progress = 0;
     private ProgressBar normalProgressBar;
     private int progressStatus = 0;
     private Handler handler = new Handler();

    
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.basicviewspart2);
        
        RadioGroup colorChoices = (RadioGroup) findViewById(R.id.colorOptions);
        colorChoices.setOnCheckedChangeListener(new OnCheckedChangeListener() {
            
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                RadioButton redOption = (RadioButton) findViewById(R.id.red);
                RadioButton blueOption = (RadioButton) findViewById(R.id.blue);
                RadioButton greenOption = (RadioButton) findViewById(R.id.green);
                
                if(redOption.getId()==checkedId){
                    displayToast("You selected red!");
                }
                
                if(blueOption.getId()==checkedId){
                    displayToast("You selected blue!");
                }
                
                if(greenOption.getId()==checkedId){
                    displayToast("You selected green!");
                }
            }
        });
        
        normalProgressBar = (ProgressBar) findViewById(R.id.normalProgressBar);
         Button download = (Button) findViewById(R.id.btnDownload);
         download.setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 //show the progress bar
                 normalProgressBar.setVisibility(0);
                 simulateProgress();
             }
 
             private void simulateProgress() {
                 progress = 0;
                 progressStatus = 0;
                 //do some work in background thread
                 new Thread(new Runnable() 
                 {
                     public void run() 
                     {
                         //do some work here
                         while (progressStatus < 10) 
                         {
                             progressStatus = doSomeWork();
                         }
                         
                         //hides the progress bar
                         handler.post(new Runnable() 
                         {
                             public void run() 
                             {
                                 //0 - VISIBLE; 4 - INVISIBLE; 8 - GONE
                                 normalProgressBar.setVisibility(8);
                             }
                         });
                     }    
                     
                     //do some long lasting work here
                     private int doSomeWork() 
                     {
                         try {
                             //simulate doing some work
                             Thread.sleep(500);
                         } catch (InterruptedException e) 
                         {
                             e.printStackTrace();
                         }
                         return ++progress;
                     }
                     
                 }).start();
             }
 
             
         });
        
    }

    /**
     * Helper method to display message
     * @param message
     */
    private void displayToast(String message){
        Toast.makeText(getBaseContext(), message, Toast.LENGTH_SHORT).show();
    }
}

The above code retrieves the progress bar we added to layout earlier as well as the button. When the button is clicked, the progress bar visibility is changed to visible mode and a background task simulation took place wherein upon its done, the visibility of the progress bar is changed back to gone. By the way, there are three representations of visibility - 0 for visible, 4 for invisible, and 8 for gone. The activity should look like below.

Moreover, ProgressBar has an attribute style wherein you can change its display. Instead of intermediate mode style like above, you can use a horizontal bar. Take note of the code:

<ProgressBar
android:id="@+id/normalProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
style="?android:attr/progressBarStyleHorizontal"
/>

And then change your activity class code in method simulationProgress() to:

//do some work here
while (progressStatus < 100) 
{
   progressStatus = doSomeWork();
                            
   //Update the progress bar
    handler.post(new Runnable() 
       {
          public void run() {
            normalProgressBar.setProgress(progressStatus);
          }
       });

}

The result should be like:

AutoCompleteTextView

It is a subclass of textview only that it has an auto complete suggestion feature. Think of a textbox while typing and under it is keyword suggestions. This basically helps you reduce the typing effort and typo error.

What we are going to do first is update the android layout xml by adding an autocomplete textview:

<AutoCompleteTextView
android:id="@+id/txtFriends"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>

Afterwards, we add code to our activity class inside onCreate method:

final String[] friends = {
                "Jose Rizal",
                "Britney Spears",
                "Sarah Walker",
                "Sarah Jane",
                "Brook How",
                "Kimberly Some",
                "Kimkrek Shoo"
        };
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,android.R.layout.simple_dropdown_item_1line, friends);
        
        AutoCompleteTextView txtFriend = (AutoCompleteTextView) findViewById(R.id.txtFriends);
        txtFriend.setThreshold(3);
        txtFriend.setAdapter(adapter);

Understanding the code above: We made an array of string where its value will be the value suggested to the user. It is feed into an ArrayAdapter object where the auto complete textview can obtain suggestions. If you notice, we also set threshold to 3. Threshold is used to set the minimum characters before suggestions appear as a drop-down menu. Try running the application and it should look like:

Nutshell

Finally, we are donw with those another three kind of useful Android views. In this tutorial we've learned more basic on views. Another article is coming up taking up more views so stay tuned. Hope this article helps you.

Check If a String Contains a Substring in Java

2010-04-15T06:16:00.000-07:00

This article shows some useful ways on checking a string that contains a substring. I find this topic relevant to document as I may someday use this on another project. Also, other developers might look for an article online to help them solve their problem. Since this topic is very basic Java, I only added short description and sample code below.


//Create a string to evaluate
String phrase = "The big brown fox jumped over the lazy dog!";

//Check if it contains a case sensitive substring
boolean evaluation = phrase.contains("brown"); //returns true
evaluation = phrase.contains("Brown"); //returns false
evaluation = phrase.indexOf("fox jumped") > 0; //returns true

//Check if phrase starts with a substring
evaluation = phrase.startsWith("Th"); //returns true

//Check if phrase ends with a substring
evaluation = phrase.endsWith("og"); //returns true

//To check string with ignore case, we should be using regular expression
evaluation = string.matches("(?i).*i am.*"); //returns true

//Check if phrase starts with a substring
evaluation = string.matches("(?i)th.*"); //returns true

//Check if phrase ends with a substring
evaluation = string.matches("(?i).*adam"); //returns true

That is all for this article. I hope this helps you.

Best Tool for Monitoring Social Media or Websites

2010-04-14T02:30:00.001-07:00

I found a great site or tool for monitoring social media or social networking websites like Twitter, Facebook, FriendFeed, YouTube, Digg, Google etc. If you wanted to know what people are saying about you, an event, any person or anything, I recommend you do a visit and perhaps, try out Social Mention services.

They have a Realtime Buzz Widget which is very interesting, very useful and very easy to use or integrate on any blog platform whether it be Wordpress, Blogger or others. It is as easy as adding a JavaScript widget into your blog template. It does not require programming skills. all you need to do is to copy the html, set the search phrase and title, and put it on your site. The code below are the only code you'll need to add into your blog.

 //See latest code on http://socialmention.com/tools/ page.
//***********************************************************
<script type="text/javascript">
// search phrase (replace this)
var smSearchPhrase = 'socialmention';
// title (optional)
var smTitle = 'Realtime Buzz';
// items per page
var smItemsPerPage = 7;
// show or hide user profile images
var smShowUserImages = true;
// widget font size in pixels
var smFontSize = 11;
// height of the widget
var smWidgetHeight = 500;
// sources (optional, comment out for "all")
//var smSources = ['twitter', 'googleblog', 'brightkite', 'delicious', 'friendfeed', 'flickr', 'identica', 'youare', 'digg'];
</script>
<script type="text/javascript" language="javascript" src="http://socialmention.com/widgets/buzz.js"></script>

The code will result to:

In my opinion and as a person who likes to write, read and share articles online and loves the internet, I find this widget very helpful and useful. Thanks to Jon Cianciullo ,the person behind this project that allows us to easily track and measure what people are saying about you, your company, a new product, or any topic across the web's social media landscape in real-time.

Android Software Competition by Globe Telecom

2010-04-10T07:32:00.000-07:00

I first heard this news from Calen Legaspi, our CEO at Orange and Bronze Software Labs, that Globe Labs will host and conduct its first mobile developer event for 2010. I've been hearing about Android platform since 2008 and now, Globe Labs posted an invitation for all developers to explore the new mobile platform.

The event is an Android software competition open for all Filipino developers. This is an invitation to all developers to build their mobile application on top of Android platform.

Big cash prizes are at stake in this competition, as well as the chance for the participating teams to pitch their product to international investors for funding. The competition will run through until July 2010. For more details on contest mechanics, dates and guidelines, please click here.

I think this event is a great opportunity for all developers. Its not just an opportunity to make money, but, an opportunity for learning how to develop an application on a new mobile platform.

To those who are interested to join this competition, visit Globe Labs website at www.globelabs.com to sign-up.

Tutorial on Android Views - Part 1

2010-04-10T07:25:00.000-07:00

On my previous articles, we had a discussion on the android's definition and layout. I assume that you have already learn basics on manipulating android layout. In this and on the next article, we will be exploring and dealing more on the various types of commonly used views such as TextView, EditText, Button, ImageButton, CheckBox and ToggleButton. Those widgets are likely the most commonly used in developing android applications.

Lets begin by creating a new project on eclipse:

After which, create an Android XML under res/layout and name it basicviews.xml having written inside is the following code below:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:orientation="vertical"
  >
  
  <TextView
      android:text="Welcome to Android!"
      android:layout_height="wrap_content"
      android:layout_width="wrap_content"
  />
  
  <EditText
      android:id="@+id/sampleText"
      android:text=""
      android:layout_height="wrap_content"
      android:layout_width="fill_parent"
  />
  
  <Button
      android:id="@+id/popupSampleText"
      android:text="Pop up"
      android:layout_height="wrap_content"
      android:layout_width="fill_parent"
  />
</LinearLayout>

The code above contains basic views such as textview, edittext and button supplied with an id. The views id will be used later and discussed further in this discussion. We are doing this layout so we will be able to play around with those views. Below is a little description on those view types.

TextView - is basically an element that is used to display text on screen or to the user. It is one of the most basic views and most commonly used in developing an android application. Also, do take note that the text inside this view type is not editable.
EditText - is another type of view that is used for character/text input such as name or passwords.
Button - it represents a push-button widget which can be pushed or clicked by the user to perform an activity, an event or an action.

Going back to views, its id must always start with "@+id/" specifier followed by a meaningful view name. So, the next step is we want to use or utilize the following views. Lets edit BasicViewsPractice.java by making its code look like below:

package com.app.techie;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

public class BasicViewsPractice extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.basicviews);
        
        Button popUp = (Button) findViewById(R.id.popupSampleText);
        popUp.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                TextView sampleText = (TextView) findViewById(R.id.sampleText);
                
                if(0 != sampleText.getText().toString().length()){
                    Toast.makeText(getBaseContext(), sampleText.getText().toString(), Toast.LENGTH_SHORT).show();
                }else{
                    Toast.makeText(getBaseContext(), "The textbox is empty!", Toast.LENGTH_SHORT).show();
                }
            }
        });
    }
}

In the code above, instead of using the main.xml layout, we replace it with basicviews.xml layout on setContentView(...) method to load the layout we just did a while ago. We also instantiated a button as well as a editview. Those views are linked to the corresponding element with the exact id on the xml layout. Moreover, we also added an onClickListener () to the button so whenever the user clicks on it, the text inside the edittext will display on screen through Toast. Try running the application and it should look like this:

There you go! Your application should be similar to above. If the edittext is empty, it should display "textbox is empty" as a message. Moving forward, add the code below on basicviews.xml just right after popupButton view.

<EditText
      android:id="@+id/sampleTextPassword"
      android:text="sample"
      android:password="true"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
  />
  
  <ImageButton
      android:id="@+id/sampleImageButton"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:src="@drawable/icon"
  />

The code added two new views. The edittext character will be replaced with a dot since we set its password attribute to true. The imagebutton is similar to a normal button view. Only that image button has an attribute where you can specify an icon to display wrap inside a button.

Lets do another update by adding the following code:

<CheckBox android:id="@+id/chkSample"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:text="Checkbox Sample"
  />
  
  <CheckBox android:id="@+id/chkStarLook" 
    style="?android:attr/starStyle" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:text="Star checkbox" 
  />

On the code, the first checkbox will look normal with a square and the second one will appear like a star since we provided a starStyle to its attribute. A checkbox is another special type of button. It has two state and its default is unchecked, otherwise its checked. For us to be able to try out checkbox view state, lets update BasicViewsPractice.java by adding the following code below:

CheckBox chkSample = (CheckBox) findViewById(R.id.chkSample);
        chkSample.setOnClickListener(new View.OnClickListener() {
            
            @Override
            public void onClick(View v) {
                if(((CheckBox) v).isChecked()){
                    Toast.makeText(getBaseContext(), "Checked", Toast.LENGTH_SHORT).show();
                }else{
                    Toast.makeText(getBaseContext(), "Unchecked", Toast.LENGTH_SHORT).show();
                }
            }
        });

That suffice how you are going to verify a chechbox view state using java code. That same code also applies to the star checkbox. Just change the id of the checkbox on your java code. Try running the code and you should be able to see something like below.

Another view that behaves like CheckBox is the ToggleButton. It has two state, checked and unchecked, just like a CheckBox view. Only that this time, it has a light indicator to display its current state. Try it out by adding a togglebutton on basicviews.xml.

<ToggleButton android:id="@+id/tglSample" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Light switch" 
/>

To be able to check its current state, add the following code below on the BasicViewsPractice.java.

ToggleButton tglSample = (ToggleButton) findViewById(R.id.tglSample);
        tglSample.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(((ToggleButton) v).isChecked()){
                    Toast.makeText(getBaseContext(), "Light On", Toast.LENGTH_SHORT).show();
                }else{
                    Toast.makeText(getBaseContext(), "Light Off", Toast.LENGTH_SHORT).show();
                }
            }
        });

As you can see above, its more or less like the code on checking a checkbox view. Try running the code and see for yourself.

Nutshell:

In this tutorial we were able to learn and experiment on textView, edittext, button, imagebutton, checkbox and toggle button. However, there are still more views to learn and they will be discussed in detail my next article. Hope you learned from this article. Enjoy!

Webmaster Tools Tip for Blogger

2010-04-02T23:27:00.001-07:00

During my research about webmaster tools, I found out that there are three major search engine that provides detailed information on how they see and crawl your website. However, they require account confirmation and website verification before you can access most of its features. Below are the steps on how you'll be able to take advantage of those search engine webmaster tools.

Google Webmaster Tools

Log in to https://www.google.com/webmasters/tools/ with your Google account.
Enter your blog URL and click Add Site.
You will be presented with several verification methods. Choose Meta Tag.
Copy the meta tag, which looks something like
<meta content="dBw5CvburAxi537Rp9qi5uG2174Vb6JwHwIRwPSLIK8" name="google-site-verification"></meta>
Leave the verification page open and go to your blog Dashboard > Layout > Edit HTML.
Open the Blogger Dashboard and paste the code after <head> tag.
Click on Save Template.
Go back to the verification page and click Verify.

Yahoo Site Explorer

Log in to https://siteexplorer.search.yahoo.com/ with your Yahoo account.
Enter your blog URL and click Add My Site.
You will be presented with several authentication methods. Choose By adding a META tag to my home page..
Copy the meta tag, which looks something like
<meta content="3236dee82aabe064" name="y_key"></meta>
Leave the verification page open and go to your blog Dashboard > Layout > Edit HTML.
Open the Blogger Dashboard and paste the code after <head> tag.
Click on Save Changes.
Go back to the verification page and click Read to Authenticate.

Bing Webmaster Center

Log in to http://www.bing.com/webmaster with your Live! account.
Click Add a Site.
Enter your blog URL and click Submit.
Copy the meta tag from the text area at the bottom. It looks something like
<meta name='msvalidate.01' content='12C1203B5086AECE94EB3A3D9830B2E'>
Leave the verification page open and go to your blog Dashboard > Layout > Edit HTML.
Open the Blogger Dashboard and paste the code after <head> tag.
Click on Save Changes.
Go back to the verification page and click Return to the Site List.

After doing those, hopefully you can now start monitoring your site on those three major search engines by using there respective webmaster tool. It will take time before it gets all the necessary data.

So, that ends my article. Hope you find this article helpful and if you have any suggestions feel free to leave a comment or shoot me an email.

Techie Focus List

2010-04-02T10:45:00.000-07:00

During my day job, I work on the business and back-end layer of a J2EE Quoting Software with heavy data handling and manipulation. Even though what I'm working on is part of an enterprise web application, I feel like my abilities in developing ground up application are depreciating. I find my self in need to keep up with the latest trends of technology and to learn what is in demand.

The scale of today's demand of software or applications seem to be in favour of the web so I decided to focus on the web stack. I made a list below of the technologies hopefully are and will be in demand soon according to the people and forums I asked on-line.

I'm actually familiar on some of the technologies below. However, I need thorough review to prepare my mindset and gain back my skills in using the those technologies and frameworks.

Technologies:

Groovy and Grails
Python and DJango
C++

Java Specific:

Java Server Faces(JSF) / Struts
Spring
JPA/JDO & Hibernate
AppEngine
WebService
JUnit & Mockery
Hudson
Ant / Ivy
IBM WebSphere
Android
JBoss/Glashfish

Databases:

MySQL
Derby
Oracle
PostgreSQL
IBM DB2
SQLite

In addition, I will also be learning Linux administration for maintaining servers as well as repairs. I'm actually a linux user since college but I still feel I need to dig deeper on systems administration. Another goal also is taking the SCJP exam late this year.

I already started and feeling great to be in the road again.

Blogger or Blogspot Title Tag Optimization Tip

2010-04-01T22:39:00.001-07:00

I know there had been lots and lots of title tag optimization tip written online. However, I thought of sharing what best and works to me among all those I have read and researched online. I made a little bit of improvement to make search engine bot crawlers read my blog title efficiently.

We do know that blogger is part of Google, however, blogger default templates are poorly optimized. To be able to compete woth other blogs, there are few things to do and that includes optimizing your blogger title tag.

The title tag is a critical part of optimizing your blogger or blogspot blog. Its the one that search engine look over when they crawl your blog links. For example, Google only looks at the first 80 characters of your blog's post title. So say for example on your default template title is rendered like: (green for blog title and orange for post title)

Techie Boy from CDO - Tutorial on Android Layout

The above wasted 20 characters occupied by the blog title which should instead be occupied by the post title. To fix the above, it should look like:

Tutorial on Android Layout - Techie Boy from CDO

Moreover, other search engines does not just read titles. Some read meta tags for description and keywords to locate your website. So, its important to also include and place relevant meta tags on your title.

So, lets begin:

1. Go to your Layout and Edit HTML tab. Check option Expand Widgets Templates and look for the following tag:

<title><data:blog.pagetitle/></title>

2. Optimize the title by replacing the code by:

<b:if cond='data:blog.pageType == &quot;index&quot;'>
        <h1><title><data:blog.title/></title></h1>
        <meta content='Provide description' name='Description'/>
        <meta content='Provide keywords' name='Keywords'/>
    <b:else/>
        <b:if cond='data:blog.pageType == &quot;archive&quot;'>
            <h1><title><data:blog.title/></title></h1>
            <meta content='Same description above' name='Description'/>
            <meta content='Same keywords above' name='Keywords'/>
        <b:else/>
            <b:if cond='data:blog.pageType == &quot;item&quot;'>
            <h1><title><data:blog.pageName/> ~ <data:blog.title/></title></h1>
            <meta expr:content='data:blog.pageName' name='Description'/>
            <meta expr:content='data:blog.pageName + data:blog.title +data:blog.pageTitle' name='Keywords'/>
        <b:else/>
            <h1><title><data:blog.pageTitle/></title></h1></b:if>
        </b:if>
    </b:if>

3. Save template and your done!

Nutshell:

This tip is just one way of optimizing your blog. SEO is difficult so to speak. There are calculations and many different ways. Another way of gaining visitors is making use of widgets like Share, Facebook Fan Page, Google Connect, RSS feeds, adding your page or blog on search engines and relevant blog directories, and many, many more...

Hope you find this article helpful. Good luck and have fun!

Tutorial on Android Layout

2010-03-28T08:03:00.000-07:00

On my previous article, I've discussed more on the theory and definition of an Android. In this article, we will be dealing more on the technical aspect of developing android application layout. I will walk you through various elements that make up the user interface(UI) and how to position different widgets on an android screen.

Terms to remember:

Activity - the basic unit of an android application. It contains views and ViewGroup.
View - a widget that has an appearance on screen.
Widget - are user interface components like buttons, labels, text boxes, etc.
ViewGroup - a special type of View that provides the layout in which you can group views, order the appearance and sequence your views.

Just an additional information; In a typical android project, UI is defined using an XML file located in the res/layout folder. An example is main.xml located in res/layout folder. During runtime, the .xml file where you defined your UI is loaded using the onCreate() event handler of your activity class and using setContentView() method of the extended Activity class. Moreover, during compilation time, each of the element in the defined UI xml file are compiled into an equivalent Android GUI class wherein its attributes are represented by methods.

Furthermore, Android supports various ViewGroups and among those are the linear, absolute, table, relative and scroll view layouts. This layouts will be discussed in details below.

At this point, I presume you already setup your development environment for programming Android applications. If you haven't, please follow the android setup tutorial.

Get Your Hands Dirty

So, lets begin by creating the sample project on eclipse. Do observe the screen shot below. (Click the image to enlarge)

There is another application called DroidDraw which you can use to design your layout aside from eclipse. Though, eclipse has its Android layout editor, it has limited features. Perhaps, you might want to use DroidDraw instead which supports drag and drop. However, its on your disposal whether which tool could help. On this ongoing tutorial, we will be using only the xml editor on eclipse.

LinearLayout

It is the layout widget where you are able to arrange your views horizontally or vertically on a single row or single column. To see the how it works, lets create linear.xml under res/layout folder in the project and enter the code below:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:id="@+id/sampleText01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Sample Text 01"
/>

<TextView
android:id="@+id/sampleText02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Sample Text 02"
/>

</LinearLayout>

and change the LayoutPractice.java code to:

package com.techie.layout;

import android.app.Activity;
import android.os.Bundle;

public class LayoutPractice extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.linear);
}
}

that will result to:

On the code above, you'll notice that it starts with a container <LinearLayout> android xml element that hold and control the order and appearance of the other views elements inside it. That serves as the main container of the views elements <TextView>. You'll also notice that we specified the layouts' orientation to vertical. By its default, it is set to horizontal. Other than that, we also specified the layouts' width and height. That basically are the basic ones that you need to specify in a layout element.

The fill_parent and wrap_content are two constants. You should use fill_parent if you want the full size of the parent container which in our case is the linear layout container. Use wrap_content if you want the size of its content. Try adding a button to linear.xml and specify its width like below:

<Button
          android:id="@+id/sampleButton01"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:text="Sample Button 01"
          />

Experiment by changing its width to wrap_content. Also, you can specify its layouts width and size by pixel(px). See the code below for an example:

<Button
          android:id="@+id/sampleButton01"
          android:layout_width="150px"
          android:layout_height="40px"
          android:text="Sample Button 01"
          />

In linear layout, layout_weight and layout_gravity attributes are applicable to views contained within it. Below is an example of how to use it.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical">
  
    <TextView
          android:id="@+id/sampleText01"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Sample Text 01"    
          />
          
    <TextView
          android:id="@+id/sampleText02"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Sample Text 02"
          />
          
      <Button
          android:id="@+id/sampleButton01"
          android:layout_width="150px"
          android:layout_height="40px"
          android:text="Sample Button 01"
          />
  <Button
          android:id="@+id/sampleButton02"
          android:layout_width="150px"
          android:layout_height="40px"
          android:text="Sample Button 02"
          android:layout_weight="0.2"
          android:layout_gravity="right"
          />
  <Button
          android:id="@+id/sampleButton03"
          android:layout_width="150px"
          android:layout_height="40px"
          android:text="Sample Button 03"
          android:layout_weight="0.2"
          android:layout_gravity="left"
          />
  <EditText       
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"        
        android:textSize="18sp"
        android:layout_weight="0.8"        
        />
  
</LinearLayout>

In the above code, we applied layout_gravity to both buttons which aligned them to right and left corner of the parent container. The layout_weight attribute was used to specify the ratio in which the button and editText views occupy the remaining space on the screen.

AbsoluteLayout

It enables you to specify the exact location of its content views like buttons, textview, and etc.. Lets create another android xml named absolute.xml under res/layout folder of the project. See the code below.

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    >
    <Button
        android:layout_width="150px"
        android:layout_height="wrap_content"
        android:text="Button 1"
        android:layout_x="12px"
        android:layout_y="361px"
        />
    <Button
        android:layout_width="150px"
        android:layout_height="wrap_content"
        android:text="Button 2" 
        android:layout_x="160px"
        android:layout_y="361px"
        />
</AbsoluteLayout>

So, in the above you'll notice that we make use of the view attributes layout_x and layout_y to specify the exact positions of the absolute layouts' contents. To be able to see the changes, do change the code below:

package com.techie.layout;

import android.app.Activity;
import android.os.Bundle;

public class LayoutPractice extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.absolute);
    }
}

It will render the user interface like this:

TableLayout

Like a normal table tag, it enables you to group views by rows and columns. Every views you place inside a row forms a cell. The cells' width is determined by the largest cell by that column.

Create table.xml under res/layout of the project folder containing the following code:

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  
  <TableRow>
          <TextView
            android:text="First Name"              
              />
          <EditText
              android:layout_width="150px"
              />
  </TableRow>
  
  <TableRow>
          <TextView
            android:text="Last Name"              
              />
          <EditText
              android:layout_width="150px"
              />
  </TableRow>
  
  <TableRow>
          <TextView
            android:text="Are you developer?"              
              />
          <CheckBox
              android:text="Yes"
              />
  </TableRow>

  <TableRow>
          <TextView
            android:text="Password"              
              />
          <EditText
              android:layout_width="150px"
              android:password="true"
              />
  </TableRow>
  
  <TableRow>
          <TextView/>
          <Button
              android:text="Submit"
              />
  </TableRow>
  
</TableLayout>

Don't forget to update the LayoutPractice activity code to

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.table);
    }

So, as you can see above, the code implemented 2 column and 5 rows. The views width on column 1 were of same size with the largest view width in that column. Note also that a view was added just above the Submit button so that the Submit button will align on the second column. If you remove the textView, it will look like this:

Moreover, on the 5th row, a textView for password was added. The attribute password was set to true so that the text entered will be replaced with a dot.

RelativeLayout

This layout enables you to specify child view's position relating to another view. It makes use of available view attributes alignParentTop, alignParentLeft, alignLeft, alighRight, below, centerHorizontal and etc. Those mentioned attributes are made available to views inside a relative layout for them to be align relative to another view. Take note that it utilize id's of another view. Take a look at the code below:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  
   <TextView
        android:id="@+id/labelComments"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Comments"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        />
    <EditText
        android:id="@+id/textComments"
        android:layout_width="fill_parent"
        android:layout_height="170px"
        android:textSize="18sp"
        android:layout_alignLeft="@+id/labelComments"
        android:layout_below="@+id/labelComments"
        android:layout_centerHorizontal="true"
        />
    <Button
        android:id="@+id/buttonSave"
        android:layout_width="125px"
        android:layout_height="wrap_content"
        android:text="Save"
        android:layout_below="@+id/textComments"
        android:layout_alignRight="@+id/textComments"
        />
    <Button
        android:id="@+id/buttonCancel"
        android:layout_width="124px"
        android:layout_height="wrap_content"
        android:text="Cancel"
        android:layout_below="@+id/textComments"
        android:layout_alignLeft="@+id/textComments"
        />
  
</RelativeLayout>

ScrollView

It is a frame layout that enables a feature where the user can scroll through a list that basically occupy more space than the available physical space on your android phone. A scrollview can only contain one viewgroup which is normally a linearlayout. The code below has a linear layout inside a scroll view.

Try this by creating scrollview.xml under res/layout folder of the project.

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    android:id="@+id/widget54"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    >
    <LinearLayout
        android:layout_width="300px"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        >
        <Button
            android:id="@+id/button1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 1"
            />
        <Button
            android:id="@+id/button2"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 2"
            />
        <Button
            android:id="@+id/button3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 3"
            />
        <EditText
            android:id="@+id/txt1"
            android:layout_width="fill_parent"
            android:layout_height="300px"
            />
        <Button
            android:id="@+id/button4"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 4"
            />
        <Button
            android:id="@+id/button5"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 5"
            />
        <EditText
            android:id="@+id/txt2"
            android:layout_width="fill_parent"
            android:layout_height="200px"
            />
    </LinearLayout>
</ScrollView>

The above code results to the following:

The above is a neat implementation of scroll view where inside is a linear container having contents that occupy more than the available actual space of an android screen.

Nutshell
In this article, you saw various layout implementations with wigets on top of Android. On the next articles, we will focus on other components of the UI which is the views. Practice on your newly learned lay-outing skill. So, stay tune and have fun with android!

I would like to give credit to Wei-Meng Lee who written a very helpful tutorial on android layout.

Learning Android By Definition

2010-03-25T01:58:00.000-07:00

Android is an open source platform for mobile devices. It is not a hardware. Its basically a software. In fact, It is a software stack as defined by Google. Encase your not familiar with the term, software stack is compose of an Operating System(OS), middle-ware & the key applications.

OS is by simply defined as platform between you and the hardware and where all applications run.
Middle-ware is/are the components and available package that allows applications to communicate to a network and to one another.
Key Applications is/are the actual programs or software that the phones will run

It was the product of the joint effort of Google and Open Handset Alliance(OHA). It was released November 5, 2007 which is shortly just after Apple's first generation iPhone release. Android is based on an opensource operating system called Linux.

Android is equipped with a set of core applications that includes an email client, SMS program, browser, contacts, calendar, maps, and others. Another good thing is that all applications are written using the Java programming language which is also an opensource programming language. See below for features.

Features
Application framework enabling reuse and replacement of components
Dalvik virtual machine optimized for mobile devices
Integrated browser based on the open source WebKit engine
Optimized graphics powered by a custom 2D graphics library; 3D graphics based on the OpenGL ES 1.0 specification (hardware acceleration optional)
SQLite for structured data storage
Media support for common audio, video, and still image formats (MPEG4, H.264, MP3, AAC, AMR, JPG, PNG, GIF)
GSM Telephony (hardware dependent)
Bluetooth, EDGE, 3G, and WiFi (hardware dependent)
Camera, GPS, compass, and accelerometer (hardware dependent)
Rich development environment including a device emulator, tools for debugging, memory and performance profiling, and a plugin for the Eclipse ID

Android is an exiting open platform for mobile development. It offer's the ability to build extremely rich and innovative applications. Developers are given freedom to take full advantage of the device hardware, retrieve location information, run silent operations, camera usage, alerts, and much, much more. Finally, the Application Program Interface(API ) is freely and fully accessible for developers. That makes learning so much easier.

Market demand for android software and developers are increasing. No wonder my company, Orange & Bronze Software Labs, Inc., was encouraging its developers to start learning, mastering and creating software/applications made in Java that runs in an Android phone.

I just started with Android couple of days ago and so far, I find it very interesting & fun to learn. So, I recommend you get started too. Good luck!

Note: To be able to learn more about Android, visit http://developer.android.com/.

Hello World by Techie Boy

2010-03-23T19:16:00.001-07:00

This is my first article post so its a Hello World article! Its hello world because most of developers do the very first application regardless of any technology that is being use, they begin by displaying a "hello world" on a computer screen or may vary with regards to its intention.

Moving forward, I'm Paul Labis. Sole writer & owner of this blog. I am a graduate of the degree in Information Management from Ateneo de Cagayan University and working as a Software Engineer in Orange & Bronze Software Labs.

I like anything related to information technology. I am also an Open Source believer. That sums up my explanation why I am inclined to Java programming, Groovy & Grails, App Engine, Python & DJango and other Open Source Frameworks.

You might be interested a bit on the reason why do I blog. Well, I'd say its primarily because I wanted to contribute and share my knowledge to everyone else who might need a hand. At first, my motivation was money but it was not enough and so for a while, I stopped blogging. Until such time and out off boredom, I reflected on a tutorial written by IBM about the groovy scripting language. I was able to reflect that if it wasn't because of this tutorial, I would not have accomplish my task. So I was deeply thinking and prospered on my decision that if I have an idle time, I'd spent it on making articles that would help other people do their task while at the same time enjoying and learning the new stuff.

I know that there are a lot of good writers on-line publishing much relevant articles as I may have, but here is a thing, I don't care... Yes! I don't really care... I know am a horrible writer though. But, whatever that is your thinking, practice results to improvement and everyone knows that..

I hope you'll enjoy my blog articles and good luck. If you have relevant concerns, please feel free to drop an email at paullabis@gmail.com.

Web Service Tutorial in Java

2010-03-22T22:13:00.000-07:00

Web Service is a piece of software that makes a service available on web. It uses a universal standard XML processing. It is interoperable in a sense that it enables a .NET software on a Windows Server to communicate to a JAVA software on a Unix. In other words, its not bound to a specific programming language or an operating system.

"Provider agent" implements a Web service
"Requester agent" (a.k.a. "client") makes use of that Web service
WSD(Web Service Description) represents a "contract"
Specifies the message formats, transport protocols, locations

What we want to do in this article is to create a project where it utilizes a web service online. I plot the step by step way of utilizing a web service through terminal.

Please note that before you start the tutorial, you should make sure that you already setup Java on your ubuntu or linux operating system. Throughout this tutorial, we are not going to use eclipse or any IDE to acomplish our objective of utilizing a remote web service.

1. Find a Remote Web Service/ Webservice

There are a lot of sample remote web services to play on in www.webservicex.net. For the purpose of this tutorial. I would like to utilize Translator Engine Web Service (http://www.webservicex.net/WCF/ServiceDetails.aspx?SID=47). We are going to use wsimport to generates portable JAX-WS artifacts for invoking a web service.

2. Create a dynamic proxy from WSDL(Web Service Description Language)

We will make it structural by creating a directory : ./TranslatorWS
Run generator on terminal by either $JAVA_HOME/Commands or $JAVA_HOME/bin/wsimport URL
In our case that is:
$ /usr/lib/jvm/java-6-sun-1.6.0.16/bin/wsimport -d ./TranslatorWS http://www.webservicex.net/TranslateService.asmx?wsdl
Result: It will generate bunch of .class files under ./TranslatorWS folder

3. Generate a jar file from the generated .class files

Open a terminal and navigate to your project.
Run on terminal:
$ jar cvf TranslatorWS.jar -C ./TranslatorWS/ .

Result: A jar file name TranslatorWS.jar is generated out of the dynamic proxy of the remote Web Service.

4. Write Client code

Let's structure our code by creating ./src folder and write something like com.client.TranslatorWSClient.java

(Note: Inside src is com folder. Inside com is client folder. Inside client folder is the Java class)
Result: You are able to create the code to utilized the web service.

package com.client;

import net.webservicex.Translate;
import net.webservicex.TranslateService;
import net.webservicex.TranslateServiceSoap;

public class TranslatorWS {
/**
*   * @param args
*     */
public static void main(String[] args) {
if (args.equals(null) || args.length == 0){
printHelp();
}

TranslateServiceSoap translatorService = new TranslateService().getTranslateServiceSoap();
if ("EnglishTOFrench".equals(args[0])){
System.out.println("Translation:");   
System.out.println(translatorService.translate(args[0], args[1]));
} 
}
private static void printHelp() {
System.out.println("TranslatorWS <language> <Word To Translate>");
}
}

5. Compile Client Code

Create a directory ./bin where you will store your compiled .class client class.
RUN on terminal:
$ javac -classpath ./TranslatorWS.jar -d ./bin/ -verbose ./src/com/client/TranslatorWS.java
Result : compiled client code under ./bin directory.

6. Run the client to utilize remote web service

Run on Terminal:

$ java -classpath ./bin/:./TranslatorWS.jar com.client.TranslatorWS EnglishTOFrench goodTranslation:
Error occured when translating text please contact support@webservicex.net

Result: A translation of the word. However, on this web service, an error message is sent back instead of the real thing.

NOTE: These are free Web services just made for practice or tutorials therefore they are unreliable, sometimes their response time is quite big and wrong.