You may encounter the issues of linking one PDF file to the power point presentation. Its pretty simple, Follow the steps :)

1. Select the text or object you want to use to link to the PDF file
2. On the Insert tab, in the Links group, click Hyperlink
3. Under Link to, Click Existing File or Webpage
4. Select the PDF file you want to link and then click Ok
5. Verify the link

Reference  

http://office.microsoft.com/en-us/powerpoint-help/using-powerpoint-2010-and-2007-with-pdf-files-HA102586125.aspx#_Toc287451153

Step 1: Download .ico file or create a .ico file
Step 2 : Right clikc on the folder you want to change and click Properties 

Step 3 :  go to Customize tab and click Change icon
Step 4 : Click browse and give the location of your .ico file 

Out come will be some thing similar to following.  Cool :)

In the web world there are many methods used by HTTP.  Following are the main methods for HTTP/1.1 specification. Every methods implemented for a specific reason. Every method have pros and cons as well. we can catercorised these methods into two divisions ass follows

1. Safe methods - GET, HEAD
2. Idempotent Methods- DELETE, GET, PUT, HEAD, OPTION TRACE

Methods 

1. GET
2. POST
3. HEAD
4. PUT
5. DELETE
6. TRACE
7. CONNECT
8. OPTION

  

When we developing android application using Phone Gap we might come across a situation where we need to show a splash screen when application starts. 

We can't have any splash screen in our html pages.

We need to do that in our Eclipse Android project,

Steps to Show a splash Screen

1.  Add a config file in app/res/xml/ folder and name it as config.xml

2. Add the following line in the config file

<plugin name="SplashScreen" value="org.apache.cordova.SplashScreen"/>

3. Copy your splash screen into your res/drawable  folder

4.  Add following line of code into your MainActivity which extends DroidGap.

 super.setIntegerProperty("splashscreen", R.drawable.splash);

    super.loadUrl("file:///android_asset/www/Phone/index.html,5000);

The first line 'super.setIntegerProperty sets the image to be display as splashsceen, The second line is normal load method, but second parameter to set the timeout value for the splash screen

  

Reference 

http://docs.phonegap.com/en/2.2.0/cordova_splashscreen_splashscreen.md.html

To run Android app in the Emulator, First We need to create the Emulator

Steps To create Emulator

1. Launch the Android Virtual Device Manager (AVD Manager) 
         By clicking the Icon AVD Manager from the Tool bar 
       Or By Click Window- Android Virtual Device Manager

2. In the AVD Manager Panel Click New

3. Enter the Details Specialty Select the Device screen Size, as well as Target Version and select other properties if you want, for the moment don't do anything to others

4.  That's all Emulator created, Click the Emulator in the AVD Manager and click Start button

Now we have created the Emulator, Its matter of running the app in the Emulator now,

1. Click the Application and Right click and select the Run as and Select Android application 

Eclipse installs the app on your AVD and starts it.

Your First Android App is ready, It will look like follows in Emulator

First you need to install following in order to start the android development.
1. Android SDK
2. Install ADT( Android Development Tool) Plug in for Eclipse
3. Download latest SDK tools and platforms using SDK manger in Eclipse

You can refer following document.

http://rupanl.blogspot.com/2012/07/getting-started-with-android.html


We are ready to develop our first Android Apps

1. Click File New Select Android folder and choose Android Application Project

2. Click Next and Fill the Application Name and Project Name and Package Name

( These are very important when it comes to real application that has to be deployed to android Market, Any way we can change them later)

Application Name - It will be shown as application Name in the Phone

Package Name - Only one application can be there in the Market with the same name 

Minimum Required SDK - Specify the lowest Android Version of the Android OS the app can run

Target SDK - Specify the Highest Version of the of the Android OS this application can run

3. Click Next, This section is to configure the Project location. 

4.  Click Nest This Section is to Configure the Launcher icon( Icon which will be displayed in the phone as the application icon), If you want to put your icon browse the icon you want to use. 

5. Click Next, This is the Screen to create the Activity Class( Class for the Screen). Select BlankActivity and Click Next.

6. Click Next and Click finish to create First Android application. 

This screen showing the Activity Name - Class related to our screen ( in Android Term Activity is class related to one screen)

Layout Name- XML file related to Layout of our Activity

We are done with our First Android Project. an Android Project created to you with necessary folder structure. 

Folder Structure we got is some thing like following

We will look the running and debugging the app in next post

Hope It helped you!!

There was a requirement to change the title of the javascript alert. But unfortunatley we can't change the default title "Alert" of the alert box.

Alternatively we can do some thing like this,

We have to define our css in order to show a box on top of the screen.

When you want to show the alert box , just change the visibility of that css class.


This is How you call the OVER LAY to pop up

<p align="center"><a href='#' onclick='overlay()'>Click here to show the overlay</a></p>

view raw gistfile1.txt hosted with ❤ by GitHub

This is the style of the OVER LAY

	.close { text-decoration: underline }
	#overlay {
	visibility: hidden;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	text-align:center;
	z-index: 200;
	background-image:url(maskBG.png);
	background-color: black;
	opacity:0.9;
	}
	#overlay div {
	width:300px;
	margin: 100px auto;
	background-color: #fff;
	border:1px solid #000;
	padding:15px;
	text-align:center;
	}

view raw gistfile1.txt hosted with ❤ by GitHub

Java script function which change the Visibility to true or false

	function overlay(){
	el = document.getElementById("overlay");
	el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
	}
	function close() {
	document.getElementById("overlay").style.visibility = 'hidden';
	}

view raw gistfile1.txt hosted with ❤ by GitHub

This is the HTML for the OVERLAY

	<div id="overlay">
	<div>
	<p>Content you want the user to see goes here.</p>
	<a href="javascript:close()">Close</a>
	</div>
	</div>

view raw gistfile1.txt hosted with ❤ by GitHub

By using this Mrthod you can have different pop ups as you want

There are a lot of architecture in the Software industry. Basically features of most  architecture  is reduce the coupling between View and Logic. By using that we can change the view when ever we want and keep the logic same.

Some of the Architectures are

1. MVC- Model View Controller
2. MVVM- Model View ViewModel


I have been working in MVC architecture in .NET web application and MVVM  architecture  in WPF desktop application, and Mono Develop Mobile application.

When i try to develop java based desktop application, i tried to do the MVC architecture using help from internet.

Basics of MVC

M-Model
V-View
C-Controller

Model Class

Which will contain the logic of the application and data base connection and manipulation.

	/*
	*program: Adding Two Numbers Using MVC
	*author: rupanl.blogspot.in
	*date: 10-May-2013
	*/
	public class Login_Model {
	public int add(String x,String y)
	{
	int a=Integer.parseInt(x);
	int b=Integer.parseInt(y);
	int result=a+b;
	return (result);
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub

View Class

View will be contains the User Interface part only.

	public class Login_View extends JFrame {
	Container con;
	JButton addButton;
	JTextField textField1,textField2,textFieldresult;
	JLabel first,second,result;
	public Login_View(Login_Model model) {
	con=getContentPane();
	setTitle("MVC ADD");
	setLayout(new FlowLayout());
	setSize(220,200);
	first=new JLabel("first variable");
	textField1=new JTextField("",10);
	second=new JLabel("second variable");
	textField2=new JTextField("",8);
	result=new JLabel("result");
	textFieldresult=new JTextField("",13);
	addButton=new JButton("add");
	con.add(first);
	con.add(textField1);
	con.add(second);
	con.add(textField2);
	con.add(result);
	con.add(textFieldresult);
	con.add(addButton);
	setVisible(true);
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub

Controller

Controller will do the communication part between View and Model
<

	import java.awt.event.ActionEvent;
	import java.awt.event.ActionListener;
	public class Login_Controller implements ActionListener
	{
	Login_Model model;
	Login_View view;
	public Login_Controller(Login_View v,Login_Model m)
	{
	model=m;
	view=v;
	actionListenerMeth(this);//add action listener to the Button
	}
	@Override
	public void actionPerformed(ActionEvent arg0) {
	try
	{
	//retrieve the input from View
	String a=view.textField1.getText();
	String b=view.textField2.getText();
	//call add method
	int result=model.add(a,b);
	//display result in View(UI)
	view.textFieldresult.setText(""+result);
	}
	catch(Exception ee)
	{
	ee.printStackTrace();
	}
	}
	public void actionListenerMeth(ActionListener ae)
	{
	view.addButton.addActionListener(ae);
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub

Main Method

	public class GlobalMVC {
	public static void main(String args[])
	{
	Login_Model m=new Login_Model();
	Login_View v= new Login_View(m);
	new Login_Controller(v,m);
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub

HTML 5 added a lot of new input types. We can do the validation easily with the newly added features.

Newly added input types are follows

1. url
2. tel
3. number
4. email
5. color
6. date
7. datetime
8. datetime-local
9. month
10. range
11. search
12. time
13. week

Some Examples

Color : 

HTML Code
<input  type="color" />

Favorite Color:

Date :
HTML Code
<input type="date" />

Date of Birth:

Number :
HTML Code
<input type="number" name="quantity" min="1" max="5">

Age :

Recently I developed a WPF MVVM application using MySQL as database. I faced a lot of problems!

One Issues i faced was when i retrieve the data from data base using linq i am getting exception  "Unable to convert MySQL date/time value to System.DateTime". When i checked the data has empty /0000-00-00  as date. When i checked in the internet i found the solution. 

Fix one Change or fix the Dates to a correct date.

Fix Two 

add the following property to connection string 

convert zero datetime=True;

You can set this when you connect to the data base as well. You have to click advanced and make the "convert zero datetime" property true;

When i tried to follow MVVM architecture in WPF, i faced the challenge of how to do Navigation to pages in Frame. finally i figured it out in the internet.

You need to have  a navigator class like following,

	public class Navigator
	{
	public static NavigationService NavigationService { get; set; }
	public static void Cancel()
	{
	MessageBoxResult result = MessageBox.Show("Are you sure you want to cancel?", "Cancel",MessageBoxButton.YesNo);
	if (result == MessageBoxResult.Yes)
	App.Current.Shutdown(1);
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub

In your App.xml.cs file under the OnStartup method put the following code

	MainWindowViewModel vm = new MainWindowViewModel(); // Your View Model for the Main Page
	MainWindow main = new MainWindow();
	Navigator.NavigationService = main.NavigationFrame.NavigationService;
	main.DataContext = vm; // Set the Data Context for your Window
	main.Show(); // Show the page
	// Load and navigate to the first page
	Page1ViewModel pagevm = new Page1ViewModel(); // Your View Model for page in the Fram
	Page1 p1 = new Page1(); // Your page to be in the Frame
	p1.DataContext = pagevm; // Set the Data Context for your page
	Navigator.NavigationService.Navigate(p1); // Call Navigate to the page

view raw gistfile1.txt hosted with ❤ by GitHub

Now you can call any pages in the ViewModel like the code follows

Navigator.NavigationService.Navigate(new Uri("Views/CashTransactions.xaml", UriKind.Relative));

view raw gistfile1.txt hosted with ❤ by GitHub

Happy Coding

Problem

PhoneGap Android Application crashes when orientation changes

Solution 

Some changes need to be done in the AndroidMainfest.xml file 

Put the following to the Main activity or all the activity you have

android:configChanges="orientation|screenSize|keyboardHidden" 

Today i found a simple way to fix the Header and Footer of the HTML page to top and bottom respectively and make the content scroll able, it will be useful when we have list of items and fixed header & footer in mobile applications. 

Here is the HTML you have to use

	<header>
	Web App Template
	</header>
	<div id="wrapper">
	<div id="scroll-content">
	<ul>
	<li>Some Stuff</li>
	<li>More Stuff</li>
	<li>Big Stuff</li>
	<li>Small Stuff</li>
	<li>Geek Stuff</li>
	<li>Nerd Stuff</li>
	<li>Fast Stuff</li>
	<li>Slow Stuff</li>
	<li>Good Stuff</li>
	<li>Bad Stuff</li>
	<li>Your Stuff</li>
	<li>My Stuff</li>
	<li>Their Stuff</li>
	<li>Our Stuff</li>
	<li>Super Stuff</li>
	<li>Uber Stuff</li>
	<li>Stuff Stuff</li>
	<li>French Stuff</li>
	<li>German Stuff</li>
	<li>English Stuff</li>
	<li>American Stuff</li>
	<li>Stuff</li>
	</ul>
	</div>
	</div>
	<footer>
	Some Footer Content
	</footer>

view raw gistfile1.html hosted with ❤ by GitHub

Here is the CSS you have to use.

	body,ul,li {
	padding:0;
	margin:0;
	border:0;
	}
	body {
	font-family:helvetica;
	}
	header{
	position:fixed;
	z-index:2;
	top:0; left:0;
	width:100%;
	height:45px;
	padding:0;
	}
	footer {
	position:fixed;
	z-index:2;
	bottom:0; left:0;
	width:100%;
	height:48px;
	padding:0;
	border-top:1px solid #444;
	}
	header, footer{
	font-size:20px;
	text-align:center;
	color:#f3f3f3;
	font-weight:bold;
	text-shadow:0 -1px 0 rgba(0,0,0,0.5);
	line-height:45px;
	opacity: 0.6;
	}
	#wrapper {
	z-index:1;
	padding: 45px 0 48px 0;
	width:100%;
	background:#aaa;
	}
	#scroll-content {
	z-index:1;
	padding:0;
	-webkit-overflow-scrolling:touch;
	overflow:auto;
	}
	ul {
	list-style:none;
	padding:0;
	margin:0;
	width:100%;
	text-align:left;
	}
	li {
	padding:0 10px;
	height:40px;
	line-height:40px;
	border-bottom:1px solid #ccc;
	border-top:1px solid #fff;
	background-color:#fafafa;
	font-size:14px;
	}

view raw gistfile1.css hosted with ❤ by GitHub

Following is the slide show i prepared for a talk in my company!!! Its talks about Mobile application development introduction level.

I have been searching in the internet to find a way of posting the codes in blogger. interestingly there are many ways to do that.  This post shows one way of posting the code. I will explain other ways in coming posts.

Step One : Go to https://gist.github.com/
Step Two : Enter description ( Its optional)
Step Three : Add a File Name
Step Four : Enter the code to be posted in the blogger
Step Five : Click the Create Public Gist
Step Six : Click the Embed and copy the code generated
Step Seven : Paste the code where u want to show the code. 

One example of the out come below.

	var dateFormat = function () {
	var token = /d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|"[^"]*"|'[^']*'/g,
	timezone = /\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,
	timezoneClip = /[^-+\dA-Z]/g,
	pad = function (val, len) {
	val = String(val);
	len = len || 2;
	while (val.length < len) val = "0" + val;
	return val;
	};

view raw dateforamt hosted with ❤ by GitHub

HTML5 Storage

HTML5 included two mechanism to store user data in client side. 

1. session storage
2. local storage

Session Storage

The session storage is designed for scenarios where the user is carrying out a single transaction, but could be carrying out multiple transaction in different window at the same time.

• How to store the values

<script type="text/javascript">

sessionStorage.star = 1;

</script>

• How to retrieve the values

<script type="text/javascript">

document.write("Total star Earned " +sessionStorage.star);

</script>

• How to clear sessionstorage
• Session storage will be cleared when browser closed

Local Storage

The Local Storage is designed for storage that spans multiple windows and lasts beyond the current session.

• How to store the values

<script type="text/javascript">

localStorage.star = 1;

</script>

• How to retrieve the values

<script type="text/javascript">

document.write("Total star Earned " + localStorage .star);

</script>

• How to clear localStorage

localstorage.clear(); will clear all local storage;

or

localStorage.remove("key"); will remove particular key

<script type="text/javascript">

localStorage.clear();

</script>

If you want to have a date picker with time or without time, and calendar picker control look at this 
http://mobiscroll.com/

There are more controls with all mobile platforms style. You can use it easily. You can have pickers like following.

WPF text box doesn't have password mode, for the password purpose WPF have another control called password box.

To get the entered text use
password property of the password box. 

example

string enteredpassword =passwordBox.Password;

 if we use MVVM architecture We can't bind to public property of our View Model. Still we can do one thing to maintain MVVM, we can set the public property for the password box change event. 

We might need to fix our footer on the bottom of the page always.  we can make that working using CSS. all we need to do is use the position: absolute in for the footer style and give the position: absolute; bottom :0;

Example
<div id="container">
<div id="header"></div>
<div id="body"></div>
<div id="footer"></div>
</div>

#footer
{
position: absolute; 
bottom :0;
width:100%;
height :100px;
}

this footer style to fix the footer on the bottom of the page always :)